生成された Flutter SDK を使用する

Firebase Data Connect クライアント SDK を使用すると、Firebase アプリからサーバーサイドのクエリと ミューテーションを直接呼び出すことができます。Data Connect サービスにデプロイするスキーマ、クエリ、ミューテーションを設計するのと 並行して、カスタム クライアント SDK を生成します。 Data Connect次に、この SDK のメソッドをクライアント ロジックに統合します。

他の場所でも説明したように、Data Connect クエリとミューテーションはクライアントコードによって送信され、 サーバーで実行されるわけではないことに注意してください。代わりに、デプロイされると、Data Connect オペレーションは Cloud Functions のようにサーバーに保存されます。つまり、既存のユーザー（古いアプリのバージョンなど）に影響を与えないようにするには、対応するクライアント サイドの変更をデプロイする必要があります。

そのため、Data Connect には、サーバーにデプロイされたスキーマ、クエリ、ミューテーションのプロトタイプを作成できる開発環境と ツールが用意されています。 また、プロトタイプ作成中にクライアントサイド SDK が自動的に生成されます。

サービスとクライアント アプリの更新を繰り返すと、サーバーサイドとクライアントサイドの両方の更新をデプロイできるようになります。

Flutter SDK を生成する

Firebase CLI を使用して、アプリで Data Connect によって生成された SDK を設定します。 init コマンドは、現在のフォルダ内のすべてのアプリを検出し、生成された SDK を自動的にインストールします。

firebase init dataconnect:sdk

プロトタイプ作成中に SDK を更新する

Data Connect VS Code 拡張機能がインストールされている場合、生成された SDK は常に最新の状態に保たれます。

Data Connect VS Code 拡張機能を使用しない場合は、Firebase CLI を使用して、生成された SDK を最新の状態に保つことができます。

firebase dataconnect:sdk:generate --watch

ビルド パイプラインで SDK を生成する

Firebase CLI を使用して、CI/CD ビルドプロセスで Data Connect SDK を生成できます。

firebase dataconnect:sdk:generate

クライアント コードを設定する

Data Connect アプリを初期化する

まず、 標準の Firebase 設定手順に沿ってアプリを初期化します。

次に、Data Connect プラグインをインストールします。

flutter pub add firebase_data_connect

Data Connect Flutter SDK を初期化する

Data Connect の設定に使用した情報（Firebase コンソールの Data Connect タブで確認できます）を使用して、Data Connect インスタンスを初期化します。

ライブラリをインポートする

クライアント コードを初期化するには、一般的な Data Connect インポートと、生成された特定の SDK インポートの 2 つのインポート セットが必要です。

// general imports
import 'package:firebase_data_connect/firebase_data_connect.dart';

// generated queries and mutations from SDK
import 'generated/movies.dart';

クライアントサイドでクエリを使用する

生成されたコードには、事前定義されたクエリ参照がすでに含まれています。インポートして execute を呼び出すだけで済みます。

import 'generated/movies.dart';

await MoviesConnector.instance.listMovies().execute();

SDK クエリ メソッドを呼び出す

アクション ショートカット関数を使用した例を次に示します。

import 'generated/movies.dart';

function onBtnClick() {
  // This will call the generated Dart from the CLI and then make an HTTP request to the server.
  MoviesConnector.instance.listMovies().execute().then(data => showInUI(data)); // == MoviesConnector.instance.listMovies().ref().execute();
}

任意のフィールド

クエリによっては、任意のフィールドが含まれる場合があります。このような場合、Flutter SDK はビルダー メソッドを公開し、個別に設定する必要があります。

たとえば、createMovie を呼び出すときにフィールド rating は省略可能であるため、ビルダー関数で指定する必要があります。

await MoviesConnector.instance.createMovie({ title: 'Empire Strikes Back', releaseYear: 1980, genre: "Sci-Fi"}).rating(5).execute();

変更をサブスクライブする

変更をサブスクライブできます（クエリを実行するたびに更新されます）。

QueryRef<ListMoviesData, void> listRef = MoviesConnector.instance.listMovies().ref();

// subscribe will immediately invoke the query if no execute was called on it previously.
listRef.subscribe().listen((data) {
  updateUIWithMovies(data.movies);
});

await MoviesConnector.instance.createMovie({ title: 'Empire Strikes Back', releaseYear: 1980, genre: "Sci-Fi" }).rating(5).execute();
await listRef.execute(); // will update the subscription above`

列挙フィールドの変更を処理する

アプリのスキーマには、列挙型を含めることができます。 これは、GraphQL クエリでアクセスできます。

アプリのデザインが変更されると、サポートされる新しい列挙値を追加できます。たとえば、アプリケーションのライフサイクルの後半で、AspectRatio 列挙型に FULLSCREEN 値を追加するとします。

Data Connect ワークフローでは、ローカル開発ツールを使用して クエリと SDK を更新できます。

ただし、クライアントの更新バージョンをリリースする前に、デプロイ済みの古いクライアントが破損する可能性があります。

復元力のある実装例

生成された SDK は、不明な値の処理を強制します。つまり、クライアント コードは EnumValue オブジェクトを Known または Unknown にアンラップする必要があります。

final result = await MoviesConnector.instance.listMovies().execute();

if (result.data != null && result.data!.isNotEmpty) {
  handleEnumValue(result.data![0].aspectratio);
}

void handleEnumValue(EnumValue<AspectRatio> aspectValue) {
  if (aspectValue.value != null) {
    switch(aspectValue.value!) {
      case AspectRatio.ACADEMY:
        print("This movie is in Academy aspect");
        break;
      case AspectRatio.WIDESCREEN:
        print("This movie is in Widescreen aspect");
        break;
      case AspectRatio.ANAMORPHIC:
        print("This movie is in Anamorphic aspect");
        break;
      case AspectRatio.IMAX:
        print("This movie is in IMAX aspect");
    }
  } else {
    print("Unknown aspect ratio detected: ${aspectValue.stringValue}");
  }
}

クライアントサイドでミューテーションを使用する

ミューテーションはクエリと同じ方法でアクセスできます。

await MoviesConnector.instance.createMovie({ title: 'Empire Strikes Back', releaseYear: 1980, genre: "Sci-Fi" }).rating(5).execute();

Flutter アプリのプロトタイプを作成してテストする

ローカル エミュレータを使用するようにクライアントをインストルメントする

Data Connect エミュレータは、 Data Connect VS Code 拡張機能または CLI から使用できます。

エミュレータに接続するようにアプリをインストルメントする方法は、どちらのシナリオでも同じです。

import 'package:firebase_data_connect/firebase_data_connect.dart';
import 'generated/movies.dart';

MoviesConnector.instance.dataConnect
          .useDataConnectEmulator('127.0.0.1', 9399);

// Make calls from your app
QueryRef<ListMoviesData, void> ref = MoviesConnector.instance.listMovies.ref();

本番環境リソースに切り替えるには、エミュレータに接続するための行をコメントアウトします。

Dart SDK のデータ型

Data Connect サーバーは、一般的な GraphQL データ型を表します。これらは SDK で次のように表されます。

Data Connect 型 Dart
タイムスタンプ firebase_data_connect.Timestamp
Int（32 ビット） int
日付 DateTime
UUID 文字列
Int64 int
浮動小数点数 double
ブール値 bool
すべて firebase_data_connect.AnyValue