この記事ではFLuttterの環境別Crashlyticsの設定方法を紹介します。

目次

1. 環境別Firebaseプロジェクトの作成
2. main.dartの実装
3. iOSの設定  
4. Androidの設定

上記の順で紹介したいと思います。
まずCrashlyticsを使用するためにFirebaseプロジェクトを作成します。URLをタップすると以下の画像のように「使ってみる」が表示されるのでタップ(ログイン、アカウントの作成を行なっていない方は作成して下さい。)

すると、以下の画像のような画面に遷移すると思うので、プロジェクトを追加→プロジェクト名を設定→続行→Default Account for Firebaseを選択し、続行→プロジェクトの作成が行われる。

プロジェクトにアプリを追加します。iOS/Android

iOSのFirebase設定方法

アプリのバンドルIDを設定→アプリを追加→xcodeでプロジェクトレベルにGoogleService-Info.plistを追加
Runner直下にFirebaseフォルダーを作成し、GoogleService-Info.plistの名前を変更し
GoogleService-Info-stg.plist, GoogleService-Info-pro.plistとします。

この際に気をつけることはXcodeからRunnerを選択し右クリックAdd File to"Runner"... を選択。

XcodeのBuild Phasesから➕ボタンを押しNew run script phasesでrun scriptを作成します。
スクリプトは以下を参考し作成して下さい。

# 以前に生成されたFirebase設定ファイルを削除
rm -rf "${SRCROOT}/firebase_app_id_file.json"

# Firebase設定ファイルをコピーして生成
if [ "${CONFIGURATION}" = "Debug" ]; then
    cp "${SRCROOT}/firebase_app_id_file_dev.json" "${SRCROOT}/firebase_app_id_file.json"
elif [ "${CONFIGURATION}" = "Profile" ]; then
    cp "${SRCROOT}/firebase_app_id_file_stg.json" "${SRCROOT}/firebase_app_id_file.json"
else
    cp "${SRCROOT}/firebase_app_id_file_prd.json" "${SRCROOT}/firebase_app_id_file.json"
fi

これにてiOSでの設定方法は完了です。

AndroidのFirebase設定方法

Firebaseでアプリを追加しAndroidパッケージ名を設定
google-services.jsonをインストールしandroid/app/srcに環境別フォルダを作成しgoogle-services.jsonを追加する。

android/app/src/dev // 開発
android/app/src/stg //　検証
android/app/src/pro //　本番

Androidでの設定は以上になります。

Firebase初期化main.dart

main関数内でawait Firebase.initilizeapp(); を追加

これでFirebaseの設定は完了になります。

次にCrashlyticsの設定方法に移ります。

flutter pub add firebase\_crashlytics

この時にcocoa podsのfirebase関係のビルドエラーが表示される場合は以下を試して下さい。

cd ios  
pod update

main.dartで以下をimportする。

import 'package:firebase\_crashlytics/firebase\_crashlytics.dart';

以下二つを追加します。

↓これはFlutter フレームワーク内でスローされたすべてのエラーを自動的にキャッチできます。

FlutterError.onError = FirebaseCrashlytics.instance.recordFlutterFatalError;

↓これはFlutter フレームワークで処理されない非同期エラーをキャッチできます。

PlatformDispatcher.instance.onError = (error, stack) {
  FirebaseCrashlytics.instance.recordError(error, stack, fatal: true);
  return true; 
};

Future<void> main() async {

  WidgetsFlutterBinding.ensureInitialized();

  // Firebase初期化
  await Firebase.initializeApp();

  // Flutter フレームワーク内でスローされたすべてのエラーを自動的にキャッチ
  FlutterError.onError = FirebaseCrashlytics.instance.recordFlutterFatalError;

  // Flutter フレームワークで処理されない非同期エラーをキャッチ
  PlatformDispatcher.instance.onError = (error, stack) {    
    FirebaseCrashlytics.instance.recordError(error, stack, fatal: true);  
    return true;

  runApp(MyApp());
}

次に、クラッシュのテストを行います。
コード1では例外を発生させるボタン
コード2ではアプリをクラッシュさせるボタン
それぞれ試してみて下さい。

コード1 例外を発生させるボタン  

ElevatedButton(
  onPressed: () {
    FirebaseCrashlytics.instance.log('ExceptionLog'); 
    throw Exception("MyException");
  },
  child: const Text('Throw Error'), 
),

コード2 アプリをクラッシュさせるボタン

ElevatedButton(
  onPressed: () { 
    FirebaseCrashlytics.instance.log('CrashLog');
    FirebaseCrashlytics.instance.crash();
  },
  child: const Text('Crash'),
),

これにてアプリ側の実装は完了です。お疲れ様でした。

次にテスト内容を確認したいので、Crashlyticsのダッシュボードを開きます。
プロダクトのカテゴリ→エンゲージメント→Crashlytics
ダッシュボードを確認してみて下さい!

これでCrashlyticsの設定方法を終了します。読んでいただきありがとうございました。これから記事を増やしていくので、チェックしていただけると嬉しいです。