😇

FirebaseCrashlyticsを使ってみた

JboyHashimoto

2023/06/30に公開

Flutter

Crashlytics

tech

どんなものなのか？

✅公式の文章を引用

Apple、Android、Flutter、Unity で動作する強力なクラッシュレポートソリューションを使用して、アプリの問題を明確かつ実践的に把握できます。

Firebase Crashlytics は軽量なリアルタイムのクラッシュレポートツールで、アプリの品質を低下させる安定性の問題を追跡し、優先順位を付け、修正するのに役立ちます。Crashlytics を使用すると、クラッシュをインテリジェントにグループ化し、クラッシュにつながった状況をあぶり出すことによって、トラブルシューティングの時間を節約できます。

特定のクラッシュが多くのユーザーに影響を与えるかどうかを調べたり、問題の重大度が急激に増した場合にアラートを受け取ったりできるほか、コード内でクラッシュの原因となっている行を特定することもできます。

✅必要なパッケージを追加

https://pub.dev/packages/firebase_core

🖊️公式のコードを追加する

今回のアプリがクラッシュした時に、データを収集するコードを追加。

Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp(
    options: DefaultFirebaseOptions.currentPlatform,
  );
  FlutterError.onError = (errorDetails) {
    // If you wish to record a "non-fatal" exception, please use `FirebaseCrashlytics.instance.recordFlutterError` instead
    FirebaseCrashlytics.instance.recordFlutterFatalError(errorDetails);
  };
  PlatformDispatcher.instance.onError = (error, stack) {
    // If you wish to record a "non-fatal" exception, please remove the "fatal" parameter
    FirebaseCrashlytics.instance.recordError(error, stack, fatal: true);
    return true;
  };
  runApp(MyApp());
}

テストするために、ボタンを押すと例外処理が発生するコードを追加します。

TextButton(
    onPressed: () => throw Exception(),
    child: const Text("Throw Test Exception"),
),

上記のコードの全体を記載

main.dart

import 'package:firebase_core/firebase_core.dart';
import 'package:firebase_crashlytics/firebase_crashlytics.dart';
import 'package:firebase_crashlytics_app/firebase_options.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';

Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp(
    options: DefaultFirebaseOptions.currentPlatform,
  );
  // FirebaseCrashlyticsを初期化
  FlutterError.onError = (errorDetails) {
    FirebaseCrashlytics.instance.recordFlutterFatalError(errorDetails);
  };
  // エラーをキャッチする
  PlatformDispatcher.instance.onError = (error, stack) {
    FirebaseCrashlytics.instance.recordError(error, stack, fatal: true);
    return true;
  };
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;

  void _incrementCounter() {
    setState(() {
      _counter++;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            const Text(
              'You have pushed the button this many times:',
            ),
            Text(
              '$_counter',
              style: Theme.of(context).textTheme.headlineMedium,
            ),
            // 例外処理を起こすボタン
            TextButton(
              onPressed: () => throw Exception(),
              child: const Text("クラッシュさせる!"),
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: const Icon(Icons.add),
      ),
    );
  }
}

👀スクリーンショット

ボタンを押して例外処理を発生させます。iOSの場合は、リリースの作業設定が必要みたいなので、今回はAndroidだけで動作確認をしております。
画面左のメニューの分析のところから、Crashlyticsの確認画面に行くことができます。アプリとFirebaseが接続されていれば、使用できます。iOSだけ特殊な設定が必要。

確認画面