Utiliser les SDK Flutter générés

Les SDK client Firebase Data Connect vous permettent d'appeler vos requêtes et mutations côté serveur directement depuis une application Firebase. Vous générez un SDK client personnalisé en parallèle lorsque vous concevez les schémas, les requêtes et les mutations que vous déployez sur votre Data Connect service. Ensuite, vous intégrez les méthodes de ce SDK dans votre logique client.

Comme nous l'avons mentionné ailleurs, il est important de noter que les Data Connect requêtes et mutations ne sont pas envoyées par le code client et exécutées sur le serveur. Au lieu de cela, une fois déployées, Data Connect opérations sont stockées sur le serveur comme Cloud Functions. Cela signifie que vous devez déployer les modifications côté client correspondantes pour éviter de perturber les utilisateurs existants (par exemple, sur les anciennes versions de l'application).

C'est pourquoi Data Connect vous fournit un environnement de développement et des outils qui vous permettent de prototyper vos schémas, requêtes et mutations déployés sur le serveur. Il génère également automatiquement des SDK côté client pendant que vous créez des prototypes.

Une fois que vous avez itéré les mises à jour de votre service et de vos applications clientes, les mises à jour côté serveur et côté client sont prêtes à être déployées.

Générer votre SDK Flutter

Utilisez la CLI Firebase pour configurer les SDK générés par Data Connect dans vos applications. La commande init doit détecter toutes les applications du dossier actuel et installer automatiquement les SDK générés.

firebase init dataconnect:sdk

Mettre à jour les SDK lors de la création de prototypes

Si l'extension Data Connect VS Code est installée, elle maintiendra toujours les SDK générés à jour.

Si vous n'utilisez pas l'extension Data Connect VS Code, vous pouvez utiliser la CLI Firebase pour maintenir les SDK générés à jour.

firebase dataconnect:sdk:generate --watch

Générer des SDK dans des pipelines de compilation

Vous pouvez utiliser la CLI Firebase pour générer des Data Connect SDK dans les processus de compilation CI/CD.

firebase dataconnect:sdk:generate

Configurer le code client

Initialiser votre application Data Connect

Commencez par initialiser votre application en suivant les instructions de configuration Firebase standards.

Ensuite, installez le Data Connect plug-in :

flutter pub add firebase_data_connect

Initialiser le SDK Flutter Data Connect

Initialisez votre Data Connect instance à l'aide des informations que vous avez utilisées pour configurer Data Connect (toutes disponibles dans l'onglet Data Connect de la console Firebase).

Importer des bibliothèques

Deux ensembles d'importations sont nécessaires pour initialiser votre code client : les importations générales Data Connect et les importations de SDK spécifiques générées.

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

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

Utiliser des requêtes côté client

Le code généré est déjà fourni avec des références de requête prédéfinies. Il vous suffit de les importer et d'appeler execute sur celles-ci.

import 'generated/movies.dart';

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

Appeler des méthodes de requête SDK

Voici un exemple d'utilisation de ces fonctions de raccourci d'action :

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();
}

Champs facultatifs

Certaines requêtes peuvent comporter des champs facultatifs. Dans ce cas, le SDK Flutter expose une méthode de compilation et doit être défini séparément.

Par exemple, le champ rating est facultatif lorsque vous appelez createMovie. Vous devez donc le fournir dans la fonction de compilation.

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

S'abonner aux modifications

Vous pouvez vous abonner aux modifications (qui seront mises à jour chaque fois que vous exécuterez une requête).

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`

Gérer les modifications apportées aux champs d'énumération

Le schéma d'une application peut contenir des énumérations, auxquelles vos requêtes GraphQL peuvent accéder.

À mesure que la conception d'une application évolue, vous pouvez ajouter de nouvelles valeurs compatibles avec l'énumération. Par exemple, imaginez que plus tard dans le cycle de vie de votre application, vous décidez d'ajouter une valeur FULLSCREEN à l'énumération AspectRatio.

Dans le workflow Data Connect, vous pouvez utiliser des outils de développement locaux pour mettre à jour vos requêtes et vos SDK.

Toutefois, avant de publier une version mise à jour de vos clients, les anciens clients déployés peuvent cesser de fonctionner.

Exemple d'implémentation résiliente

Le SDK généré force la gestion des valeurs inconnues. Autrement dit, le code client doit décompresser l'objet EnumValue en Known ou 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}");
  }
}

Utiliser des mutations côté client

Les mutations sont accessibles de la même manière que les requêtes.

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

Créer des prototypes et tester vos applications Flutter

Instrumenter les clients pour utiliser un émulateur local

Vous pouvez utiliser l'émulateur Data Connect, que ce soit à partir de l' extension Data Connect VS Code ou de la CLI.

L'instrumentation de l'application pour se connecter à l'émulateur est la même dans les deux cas.

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();

Pour passer aux ressources de production, commentez les lignes de connexion à l'émulateur.

Types de données dans le SDK Dart

Le serveur Data Connect représente les types de données GraphQL courants. Ils sont représentés dans le SDK comme suit.