FlutterでFirebaseを使ってみる〜Firebase導入編（iOS）〜

投稿の経緯

FlutterのキャッチアップでFirebaseと連携してFirestoreを使うサンプルプロジェクトを立ち上げました。今回はiOSアプリにFirebaseを導入してエミュレーターでビルドするところまでを書こうと思います。

環境

Flutter：2.8.1
MacOS：12.1

サンプルプロジェクト

GitHubにコードPushしています。気になる方はご覧ください。

Firebaseの導入

公式情報を参考にして進めていきます。

Firebaseプロジェクトの作成

Firebaseプロジェクトに名前をつけます。今回はfirestore-trainingです。

今回アナリティクスは無効にしてプロジェクトを作成します。

アプリをFirebaseに登録する

Firebaseプロジェクトを作成したらコンソールのiOS+からアプリをFirebaseに登録しましょう。Apple バンドル IDの箇所にアプリのバンドルIDを入力します。

バンドルIDはXcodeから取得します。

/Flutterプロジェクト/ios/Runner.xcodeproj/を開いて赤丸箇所から取得します。
アプリのニックネームとApp Store IDは任意なので今回はスキップします。

続いてGoogleService-Info.plistをダウンロードしてファイルをFlutterアプリに追加します。

追加場所は画像にあるように/Flutterプロジェクト/ios/Runner/ディレクトリです。
続いてFirebase SDK の追加と初期化コードの追加をスキップしてコンソロールへ進みます。

FlutterFireプラグインを追加する

Flutter Fireとは？

Flutter はプラグインを使用して、Firebase API などの幅広いプラットフォーム固有サービスへのアクセスを提供します。プラグインには、各プラットフォームのサービスと API にアクセスするためのプラットフォーム固有のコードが含まれています。Firebase へのアクセスには、Firebase プロダクト（Realtime Database、Authentication、アナリティクス、Cloud Storage など）ごとに存在するさまざまなライブラリが使用されます。Flutter が提供する Firebase プラグインのセットは、FlutterFire と総称されています。

公式ではこのように書かれています。

エミュレーターとデバイス上でアプリが実行されていないことを確認してpubspec.yamlファイルを開き、FlutterFireプラグインを追加します。今回はfirebase_coreとcloud_firestoreを追加します。

pubspec.yaml

# 省略

dependencies:
  flutter:
    sdk: flutter
  firebase_core: ^0.4.0+9
  cloud_firestore: ^0.12.9+5

# 省略

これで設定は完了です。

アプリをビルドする

続いてiOSアプリをビルドしましょう。

The plugin `cloud_firestore` uses a deprecated version of the Android embedding.
To avoid unexpected runtime failures, or future build failures, try to see if this plugin supports the Android V2 embedding. Otherwise, consider removing it since a future release of Flutter will remove these deprecated APIs.
If you are plugin author, take a look at the docs for migrating the plugin to the V2 embedding: https://flutter.dev/go/android-plugin-migration.

ビルドのタイミングでこのようにエラーが発生した場合、flutter pub upgrade --major-versionsを実行してプラグインをメジャーバージョンへアップデートする必要があります。コマンドを実行すると自動でpubspec.yamlが更新されます。

2022年1月の時点ではfirebase_coreは1.11.0、cloud_firestoreは3.1.6がメジャーバージョンとして扱われているようです。

アップデートが完了したらPodfileを編集します。
編集項目は以下2点。

• platformを9.0から10.6へ変更
• pod FirebaseFirestoreを追加

# Uncomment this line to define a global platform for your project
platform :ios, '9.0' <- ここを10.6に編集

 ///// 省略 /////

target 'Runner' do
  use_frameworks!
  use_modular_headers!
  pod 'FirebaseFirestore', :git => 'https://github.com/invertase/firestore-ios-sdk-frameworks.git', :tag => '8.10.0' <- ここを追加
  flutter_install_all_ios_pods File.dirname(File.realpath(__FILE__))
end

 ///// 省略 /////

この状態でビルドを実行すると成功すると思います。

おわりに

今回はFlutterプロジェクトのiOSアプリにFirebaseを導入してエミュレーターでビルドするところまでを記事にしました。次回、AndroidアプリとFirebaseを連携する方法も記事にしようと思います。

ご覧いただきありがとうございました。
こうしたほうがいいや、ここはちょっと違うなど気になる箇所があった場合、ご教示いただけると幸いです。

お知らせ

現在副業でiOSアプリ開発案件を募集しています。

↓活動リンクはこちら↓
https://linktr.ee/sasaki.ken

Twitter DMでご依頼お待ちしております！