| ページ一覧 | ブログ | twitter |　 書式 | 書式(表) |

MyMemoWiki

FlutterFire

提供: MyMemoWiki
ナビゲーションに移動 検索に移動

| Dart | Flutter | ブログカテゴリ(Flutter) | Android Studio | Flutter macos | Flutter 手順 | Flutter Riverpod |

FlutterFire

Firebase CLI

$ npm install -g firebase-tools

Install

  • Migration
  • Firebase のサービスを利用する前に、まず firebase_core プラグインをインストールする必要があります。
  • このプラグインは、アプリケーションを Firebase に接続する役割を果たします。
  • このプラグインをpubspec.yamlファイルに追加します。

pubspec.yaml 

dependencies:
  flutter:
    sdk: flutter
  firebase_core: "^1.3.0"

$ flutter pub get

Platform セットアップ

Web

Android

build.gradle
  • android/build.gradle
buildscript {
  dependencies {
    // ... other dependencies
    classpath 'com.google.gms:google-services:4.3.8'
  }
}
  • android/app/build.gradle
apply plugin: 'com.google.gms.google-services'
署名
  • https://developers.google.com/android/guides/client-auth
  • Java に付属の keytool ユーティリティを実行して、証明書の SHA-1 フィンガープリントを取得します。
  • リリース証明書のフィンガープリントとデバッグ証明書のフィンガープリントの両方を取得する必要があります。
    • リリース証明書のフィンガープリントを取得
keytool -list -v -alias <your-key-name> -keystore <path-to-production-keystore>
    • デバッグ証明書のフィンガープリントを取得
    • デフォルトパスワードは android
keytool -list -v -alias androiddebugkey -keystore ~/.android/debug.keystore
"google-services.json" file to the project?
  • https://firebase.google.com/docs/android/setup?hl=ja
  • Firebase Android 構成ファイルをアプリに追加します。
  • google-services.json のダウンロード ボタン をクリックして、Firebase Android 構成ファイル（google-services.json）を取得します。
  • 構成ファイルをアプリのモジュール（アプリレベル）ディレクトリに移動します。

iOS

https://firebase.google.com/docs/ios/setup

GoogleService-Info.plist 追加
  1. FirebaseでiOSアプリを登録
  2. FirebaseアプリのGoogleService-Info.plistファイルをダウンロード
  3. ios/Runner.xcworkspace をxcodeで開く
  4. Xcode内の左側のプロジェクト・ナビゲーションから「Runner」を右クリックし「Add files」を選択
  5. "Copy items if needed" を有効にして、GoogleService-Info.plistファイルを取り込む

Ios flutter fire.png

fatal error: module 'firebase_core' not found エラー
Error output from Xcode build:
↳
    ** BUILD FAILED **


Xcode's output:
↳
    /Users/hirotoyagi/Workspaces/flutter/tenarai_online/ios/Runner/GeneratedPluginRegistrant.m:10:9: fatal error: module 'firebase_core'
    not found
    @import firebase_core;

$ flutter clean
$ cd ios
$ rm -rf Pods
$ rm Podfile.lock Podfile
$ flutter run
  • Podfile
# Uncomment this line to define a global platform for your project
platform :ios, '10.0'

macOS

  • XCodeで、open ./macos/Runner.xcworkspace/

Flutterfire google plist macos.png

  • GoogleService-Info.plist
    • ダウンロード
    • Runner右クリックからファイルを追加
    • 以下の画面のチェックをONにして追加

Firebase Emulator Suiteの一部を使用して、開発中のローカルマシンでfirebaseサービスをエミュレートしたい場合は、macOSアプリが安全でない接続でローカルネットワークサービスに接続することを許可する必要があります。安全でない接続を許可するには、アプリケーションのplistファイル内に以下を追加 

<key>NSAppTransportSecurity</key>
<dict>
    <key>NSAllowsLocalNetworking</key>
    <true/>
</dict>
  • 以下のエラーの場合
[!] The FlutterFire plugin firebase_core for macOS requires a macOS deployment target of 10.12 or later.
    • macos/Podfileの修正
platform :osx, '10.12'

Windows

  • C++によるデスクトップ開発のインストール

Flutter win.png

Web

Debug

MacのEdgeでFlutterのデバッグをする

初期化

  • Firebaseのサービスを使用する前に、FlutterFireを初期化する必要があります
  • 初期化ステップは非同期なので完了するまではFlutterFire関連の使用を禁止する必要があります。
  • FlutterFireを初期化するには、FirebaseクラスのinitializeAppメソッドを呼び出します

Authentication

Instration

Stableチャネルに切り替え

$ flutter channel stable
Switching to flutter channel 'stable'...
git: From https://github.com/flutter/flutter
git:  + 2b9537c783...cc00e7e6bc dev                     -> origin/dev  (forced update)
git:  * [new branch]            dnfield-patch-1         -> origin/dnfield-patch-1
git:  * [new branch]            flutter-2.4-candidate.1 -> origin/flutter-2.4-candidate.1
git:  * [new branch]            flutter-2.4-candidate.2 -> origin/flutter-2.4-candidate.2
git:  * [new branch]            flutter-2.4-candidate.3 -> origin/flutter-2.4-candidate.3
git:  * [new branch]            flutter-2.4-candidate.4 -> origin/flutter-2.4-candidate.4
git:  * [new branch]            flutter-2.4-candidate.5 -> origin/flutter-2.4-candidate.5
git:    52e2ca38fc..2108fbd78d  master                  -> origin/master
git:  + c8311f68be...f4d2c79a6a revert-85466-revert-85221-0624new -> origin/revert-85466-revert-85221-0624new  (forced update)
git:  * [new branch]            revert-86171-revert-83924-textTheme -> origin/revert-86171-revert-83924-textTheme
git:  * [new branch]            revert-86198-deprecate_appbar_backwards_compatibility_flag -> origin/revert-86198-deprecate_appbar_backwards_compatibility_flag
git:  * [new branch]            test                    -> origin/test
git:  * [new branch]            test2                   -> origin/test2
git:  * [new tag]               2.4.0-0.0.pre           -> 2.4.0-0.0.pre
git:  * [new tag]               2.4.0-4.0.pre           -> 2.4.0-4.0.pre
git: Already on 'stable'
git: Your branch is up to date with 'origin/stable'.
Successfully switched to flutter channel 'stable'.
To ensure that you're on the latest build from this channel, run 'flutter upgrade'
  • 確認
$ flutter channel
Flutter channels:
  master
  dev
  beta
* stable

pubspec.yaml

  • firebase_authを追記
dependencies:
  flutter:
    sdk: flutter
  firebase_core: "^1.4.0"
  firebase_auth: "^3.0.1"
  • 更新
$ flutter pub get

Web

  • 追記
<script src="https://www.gstatic.com/firebasejs/8.6.1/firebase-auth.js"></script>

iOS/macOS

  • cd ios/macos
  • macos 例
$ flutter clean
$ rm -rf Pods
$ rm Podfile 
$ rm Podfile.lock 
$ pod repo update
$ flutter run -d macos
  • Podfile
platform :osx, '10.12'

認証の永続性

Google

iOS

  • ios/Runner/info.plist
<!-- Put me in the [my_project]/ios/Runner/Info.plist file -->
<!-- Google Sign-in Section -->
<key>CFBundleURLTypes</key>
<array>
	<dict>
		<key>CFBundleTypeRole</key>
		<string>Editor</string>
		<key>CFBundleURLSchemes</key>
		<array>
			<!-- TODO Replace this value: -->
			<!-- Copied from GoogleService-Info.plist key REVERSED_CLIENT_ID -->
			<string>com.googleusercontent.apps.{GoogleService-Info.plist から、この部分を取得する}</string>
		</array>
	</dict>
</array>
<!-- End of the Google Sign-in Section -->
「https://www.typea.info/tips_/index.php?title=FlutterFire&oldid=33833」から取得

© 2006 矢木浩人