使用產生的 Flutter SDK

Firebase Data Connect 用戶端 SDK 可讓您直接從 Firebase 應用程式呼叫伺服器端查詢和變異。您可以同時產生自訂用戶端 SDK,同時設計要部署至 Data Connect 服務的結構定義、查詢和變異。接著,您將整合此 SDK 的方法至用戶端邏輯。

如同我們在其他地方提到的,請務必注意 Data Connect 查詢和變異不會由用戶端程式提交,而是在伺服器上執行。相反地,在部署時,Data Connect 作業會儲存在 Cloud Functions 等伺服器上。這表示您必須部署相應的用戶端端變更,以免影響現有使用者 (例如舊版應用程式)。

因此,Data Connect 提供開發人員環境和工具,讓您製作伺服器部署的結構定義、查詢和變異的程式原型。在您製作原型時,它也會自動產生用戶端 SDK。

服務和用戶端應用程式更新完成後,即可部署伺服器和用戶端更新。

產生 Flutter SDK

如同大多數 Firebase 專案,Firebase Data Connect 用戶端程式碼的相關工作會在本機專案目錄中進行。Data Connect VS Code 擴充功能和 Firebase CLI 都是用於產生及管理用戶端程式碼的重要本機工具。

SDK 產生選項會與您在初始化專案時產生的 dataconnect.yaml 檔案中的多個項目相關聯。

初始化 SDK 產生作業

connector.yaml 中新增 outputDirpackage 和 (針對網路 SDK) packageJsonDir
connectorId: movies
generate:
  dartSdk:
    outputDir: ../../lib/generated # Feel free to change this to a different path
    package: movies

outputDir 會指定產生的 SDK 應輸出至何處。這個路徑相對於包含 connector.yaml 檔案本身的目錄。您也可以選擇提供 outputDir 的絕對路徑。

package 會指定套件名稱。

在原型設計期間更新 SDK

如果您使用 Data Connect VS Code 擴充功能及其 Data Connect 模擬器進行互動式原型設計,SDK 來源檔案會在您修改定義結構定義、查詢和突變的 .gql 檔案時自動產生及更新。這項功能在熱門 (重新) 載入工作流程中非常實用。

在其他情況下,如果您使用 Firebase CLI 的 Data Connect 模擬器,可以在 .gql 更新中設定智慧手錶,也可以讓 SDK 來源自動更新。

或者,您也可以在 .gql 檔案變更時使用 CLI 重新產生 SDK:

firebase dataconnect:sdk:generate --watch

產生 SDK 以便整合及發布正式版

在某些情況下,例如準備要提交 CI 測試的專案來源,您可以呼叫 Firebase CLI 進行批次更新。

在這種情況下,請使用 firebase dataconnect:sdk:generate

設定用戶端程式碼

初始化 Data Connect 應用程式

首先,請按照標準 Firebase 設定操作說明初始化應用程式。

接著,安裝 Data Connect 外掛程式:

flutter pub add firebase_data_connect

初始化 Data Connect Flutter SDK

使用您在設定 Data Connect 時提供的資訊初始化 Data Connect 例項 (可在 Firebase 控制台的「Data Connect」分頁中找到所有資訊)。

匯入程式庫

初始化用戶端程式碼時,需要兩組匯入作業,分別是一般 Data Connect 匯入作業和特定的產生 SDK 匯入作業。

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

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

製作原型並測試 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();

如要切換至正式版資源,請將用於連線至模擬器的程式碼行註解掉。

在用戶端使用查詢

產生的程式碼會隨附預先定義的查詢參照。您只需要匯入這些檔案,並呼叫 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`

在用戶端使用變異

變異體的存取方式與查詢相同。

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

Dart SDK 中的資料類型

Data Connect 伺服器代表常見的 GraphQL 資料類型。這些元素在 SDK 中的表示方式如下所示。

資料連結類型 Dart
時間戳記 firebase_data_connect.Timestamp
Int (32 位元) int
日期 DateTime
UUID 字串
Int64 int
浮點值 雙精度值
布林值 bool
不限 firebase_data_connect.AnyValue