LoginSignup
18
12

More than 3 years have passed since last update.

Flutter × Firebase Remote Configでメンテナンス中画面構築してみた

Last updated at Posted at 2021-04-22

今リリース中の課題管理アプリでメンテナンス作業が多くその間にユーザーの方々にアプリの使用を止める実装が必要だなと感じたので実装しました。
いわゆる「メンテナンス表示画面」
(ゲームアプリとかでもよくありますよね)

環境など

ツールなど バージョンなど
MacBook Air Retina2020 macOS Catalina 10.15.7
Android Studio 4.0.0
Flutter 2.0.4
Dart 2.12.2
Xcode 12.4

はじめに

Firebase Remote Configとは??

Firebase Remote Configは、アプリ内パラメータを定義し、その値をクラウドで更新することができるサービスです。
クラウド上で管理する値を変更するだけで、即座にアプリに変更を反映させることができます。

本来であれば、コードを変更し、Appleに審査を通すなどのプロセスが必要ですが、Firebase Remote Configを使えば、すぐにアプリのデータの更新が可能になります。
今回はこれを使ってアプリメンテナンス中でユーザーにアプリの使用を止めたいときの処理を実装していきます!

ダウンロード (1).gif

実装手順

1.Firebase Remote Configにkeyを登録する

スクリーンショット 2021-04-22 19.53.06.png

2.Remote Configのパラメーターを取得する

Future<bool> maintenanceCheck() async {
  bool check = true;
  final remoteConfig = await RemoteConfig.instance;
  await remoteConfig.fetch(expiration: const Duration());
  await remoteConfig.activateFetched();
  final isUnderMaintenance = remoteConfig.getBool('isUnderMaintenance');
  if (isUnderMaintenance) {
    return check;
  } else {
    check = false;
    return check;
  }
}

3.Remote Configの値でBool値を用意

Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();

  bool isMaintenance = await maintenanceCheck();
  runApp(MyApp(isMaintenance));
}

class MyApp extends StatelessWidget {
  bool isUnderMaintenance
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        primarySwatch: Colors.green,
      ),
      home: MyHomePage(title: 'Flutter Auth Demo'),
    );
  }
}

4.メンテンス中かどうかで表示画面を変更

home: StreamBuilder(
          builder: (context) {
            if (isUnderMaintenance) {
              return AlertDialog(
                      content: Text(
                        'アプリメンテナンス中です。ご不便をおかけしますが、一時的にご利用を停止させていただいております。',
                        style: TextStyle(
                          color: Colors.black,
                          fontSize: 19.0,
                        ),
                      ),
                    ),
                } else {

感想

これができると、次は強制アップデートも実装できるので続きをやっていこうと思います!
Flutterでのドキュメントが非常に少なかったので、こんな感じですがとりあえず残しておこうと思います。

参考文献

Firebase Remote Config

https://firebase.google.com/docs/remote-config?hl=ja

Flutterでアプリに強制アップデートの仕組みを入れる

https://qiita.com/kasa_le/items/a7bae1b9aef6dfde2504

18
12
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
18
12