著者アーカイブ 村上

著者:村上

【Cordova】「cordova-plugin-firebase-crashlytics」でFirebaseのCrashlyticsを導入

タイトル通り、Cordova で開発しているアプリに Google Firebase の Crashlytics を導入する方法です。
最初、Fabric がいいかな？と思ったのですが、こちらのサービスは Firebase と統合されるとのことでしたので、Firebase を使うことにしました。

GitHub のページはこちらから。

GitHub – ReallySmallSoftware/cordova-plugin-firebase-crashlytics: Google Firebase Crashlytics Cordova plugin
https://github.com/ReallySmallSoftware/cordova-plugin-firebase-crashlytics

インストールのコマンドは下記のとおり。

cordova plugin add cordova-plugin-firebase-crashlytics

GitHub に載っていたコマンドは cordova plugin add cordova-plugin-firebase-crashlytics --variable ANDROID_FIREBASE_CORE_VERSION=16.0.0 だったのですが、バージョンを指定しないとデフォルト値が指定されるとのことだったので省略しました。
特にインストール時にエラー等は発生しなかったので問題ないかと。

あとは、導入手順にそって下記のコードを追加すれば OK です。
下記のサンプルコードでは、キャッチされた例外をログに記録することができます。

var crashlytics = FirebaseCrashlytics.initialise();
crashlytics.logException("my caught exception");

なお、Firebase の導入には google-services.json と GoogleService-Info.plist を設置する必要があります。
こちらについては、下記の Firebase 公式ドキュメントにリンクがありますので、そちらをご参考ください。

Firebase Crashlytics を使ってみる｜Firebase
https://firebase.google.com/docs/crashlytics/get-started

また、iOS については Podfile に use_frameworks! を手動で追加する必要があるとのことでしたので、対応ください。
が、それだけでは連携できなかったので、上記の Firebase のドキュメントについても参考にしました。
でもなんか正しくない気がするので、要調整でしょうか。
一度設定をリセットしてからもう一度やり直そうかと思っています。

Android については、エラーは発生しないものの、アプリを実行しても Firebase と連携できず…。
一体何が悪いのか…判明したらまたまとめたいと思います。

以上、Cordova アプリに Firebase の Crashlytics を導入する方法でした。
とりあえず、現時点でのまとめなので、進捗あればまたご紹介します。
ご参考になれば幸いです。

著者:村上

【Cordova】画像をリサイズできるプラグイン「cordova-plugin-image-resizer」

カメラプラグインで取得した画像をリサイズするときに使ったプラグイン「cordova-plugin-image-resizer」のご紹介です。
以前は違う方法でリサイズ処理を行っていたのですが、プラグインを探したらこちらの方が簡単！ということで乗り換えました。

今回使用したプラグインの GitHub はこちらから。

GitHub – JoschkaSchulz/cordova-plugin-image-resizer
https://github.com/JoschkaSchulz/cordova-plugin-image-resizer

インストールは下記のコマンドを使います。
が、こちらのプラグインはカメラプラグインの導入が必要とのことでしたので、インストールする前に、先にカメラプラグインをインストールしてください。

// カメラプラグイン
cordova plugin add cordova-plugin-camera
// 画像リサイズプラグイン
cordova plugin add https://github.com/protonet/cordova-plugin-image-resizer.git

あとは、下記のコードを追加すればOKです。
なお、サンプルコードはカメラプラグインで画像を取得するところから記述しています。

// カメラプラグインでアルバムから画像取得
var cameraoptions = {
  sourceType: Camera.PictureSourceType.PHOTOLIBRARY,
  quality: 50,
  encodingType: Camera.EncodingType.JPEG,
  destinationType: Camera.DestinationType.FILE_URI
}
navigator.camera.getPicture(function(imageURI) {
  // 画像リサイズ
  let resizeoptions = {
    uri: imageURI,
    folderName: "[任意のフォルダ名]",
    quality: 70,
    width: 1000,
    height: 1000,
    base64: true,
    fit: false
  };
  window.ImageResizer.resize(resizeoptions,
    function(image) {
       // 画像リサイズ成功時の処理
    }, function() {
      // 画像リサイズ失敗時の処理 
    });
}, function(error) {
  // 画像取得失敗時の処理
}, cameraoptions);

10行目からのリサイズオプションで、画像 URI やリサイズ後の高さや幅、画質などを決定しています。
リサイズ後の画像パスは 20行目のファンクションの引数 image で取得できます。

また、環境の都合上、上記のコードでは リサイズ後の画像は base64 形式になっています。
こちらは 16行目で指定しています。

17行目の fit は、リサイズ後の画像を指定した幅・高さに合わせるかどうかを指定します。
こちらは Android のみに反映される設定です。

以上、画像のリサイズを行えるプラグイン「cordova-plugin-image-resizer」のご紹介でした。
ご参考になれば幸いです。