Firebase Remote-Konfiguration:

Firebase Remote Config ist die einfachste Möglichkeit, Ihre mobile App anzupassen, sobald Sie sie für Play und im App Store veröffentlicht haben. Im Allgemeinen müssen Sie die App aktualisieren, wenn es Änderungen gibt.

Diese Updates müssen nach ordnungsgemäßen Tests und Genehmigungen in die Stores übertragen werden, selbst wenn es sich um eine kleine Änderung handelt, aber bis sie realisierbar ist, dauert es viel Zeit.

Außerdem aktualisieren möglicherweise nicht alle Benutzer die App, sobald Sie sie veröffentlicht haben, sodass sich dieser Vorgang verzögern kann.

Um all diese Situationen zu vermeiden, haben wir eine verfügbare Remote-Konfigurationsoption verwendet Firebase. Das erleichtert den Umgang mit internen Änderungen innerhalb der App.

es Tutorial sehen wir die Firebase Implementieren der Remote-Konfiguration in der Flatter-App, indem wir versuchen, ein Bild und einen Text in unserer App viel schneller als zuvor zu aktualisieren.

pubspec.yaml:

Fügen Sie die erforderlichen Abhängigkeiten, dh Firebase Core und Firebase Remote Config, zur Pubspec-Datei hinzu. Stellen Sie außerdem sicher, dass Sie hier die neueste Version bereitstellen, um Probleme auf Codeebene zu vermeiden.

firebase_core: ^1.10.6
firebase_remote_config: ^1.0.3

main.dart:

Initialisieren Sie void main und machen Sie es asynchron, damit es die Firebase-Initialisierung wie unten durchführt

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp();
  runApp(MaterialApp());
}

Wir haben eine Funktion erstellt, um das Ergebnis aus der Remote-Konfiguration zu erhalten

Future<RemoteConfig> setupRemoteConfig() async {
  final RemoteConfig remoteConfig = RemoteConfig.instance;

  await remoteConfig.fetch();
  await remoteConfig.activate();

//testing
  print(remoteConfig.getString("Text"));

  return remoteConfig;
}

Versuchen Sie nun, diese Methode aufzurufen, und nehmen Sie das Snapshot-Ergebnis wie folgt auf

FutureBuilder<RemoteConfig>(
  future: setupRemoteConfig(),
  builder: (BuildContext context, AsyncSnapshot<RemoteConfig> snapshot) {
    return snapshot.hasData
        ? Home(remoteConfig: snapshot.requireData)
        : Container(
            child: Text("No data available"),
          );
  },
),

Jetzt werden wir versuchen, eine Hausklasse zu verlängern Animiertes Widget Um die Änderungen hier zu hören, hören wir uns die neuen Daten aus der Remote-Konfiguration an.

class Home extends AnimatedWidget {

final RemoteConfig remoteConfig;

Home({required this.remoteConfig}) : super(listenable: remoteConfig);

Jetzt erstellen wir ein gebrauchtes Design, in das wir die Daten aus der Remote-Konfiguration einfügen

SizedBox(
  height: 150.0,
),
Image.network(remoteConfig.getString("Image")),
SizedBox(
  height: 50.0,
),
Text(
  remoteConfig.getString("Text"),
  style: TextStyle(fontSize: 20.0),
),
SizedBox(
  height: 20.0,
),
Text(remoteConfig.lastFetchStatus.toString()),
SizedBox(
  height: 20.0,
),
Text(remoteConfig.lastFetchTime.toString()),
SizedBox(
  height: 20.0,
),

Fügen Sie eine schwebende Aktionsschaltfläche hinzu, um die Daten zu aktualisieren

FloatingActionButton(onPressed: () async {
  try {
    await remoteConfig.setConfigSettings(RemoteConfigSettings(
        fetchTimeout: Duration(seconds: 10),
        minimumFetchInterval: Duration.zero));
    await remoteConfig.fetchAndActivate();
  } catch (e) {
    print(e.toString());
  }
},child: const Icon(Icons.refresh),)

Geben Sie den vollständigen Code zum Implementieren der Firebase-Remotekonfiguration an.

import 'package:firebase_core/firebase_core.dart';
import 'package:firebase_remote_config/firebase_remote_config.dart';
import 'package:flutter/material.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp();
  runApp(MaterialApp(
    debugShowCheckedModeBanner: false,
    title: "Remote Config",
    home: FutureBuilder<RemoteConfig>(
      future: setupRemoteConfig(),
      builder: (BuildContext context, AsyncSnapshot<RemoteConfig> snapshot) {
        return snapshot.hasData
            ? Home(remoteConfig: snapshot.requireData)
            : Container(
                child: Text("No data available"),
              );
      },
    ),
  ));
}

class Home extends AnimatedWidget {
  final RemoteConfig remoteConfig;

  Home({required this.remoteConfig}) : super(listenable: remoteConfig);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Remote Config"),
      ),
      body: Center(
        child: Padding(
          padding: const EdgeInsets.all(30.0),
          child: Column(
            children: [
              SizedBox(
                height: 150.0,
              ),
              Image.network(remoteConfig.getString("Image")),
              SizedBox(
                height: 50.0,
              ),
              Text(
                remoteConfig.getString("Text"),
                style: TextStyle(fontSize: 20.0),
              ),
              SizedBox(
                height: 20.0,
              ),
              Text(remoteConfig.lastFetchStatus.toString()),
              SizedBox(
                height: 20.0,
              ),
              Text(remoteConfig.lastFetchTime.toString()),
              SizedBox(
                height: 20.0,
              ),
              FloatingActionButton(onPressed: () async {
                try {
                  await remoteConfig.setConfigSettings(RemoteConfigSettings(
                      fetchTimeout: Duration(seconds: 10),
                      minimumFetchInterval: Duration.zero));
                  await remoteConfig.fetchAndActivate();
                } catch (e) {
                  print(e.toString());
                }
              },child: const Icon(Icons.refresh),)
            ],
          ),
        ),
      ),
    );
  }
}

Future<RemoteConfig> setupRemoteConfig() async {
  final RemoteConfig remoteConfig = RemoteConfig.instance;

  await remoteConfig.fetch();
  await remoteConfig.activate();

//testing
  print(remoteConfig.getString("Text"));

  return remoteConfig;
}

Ausgabe:

Der folgende Bildschirm zeigt die Verwendung der Firebase-Remote-Konfiguration in der Flutter-App.

Wenn Sie Fragen zu diesem Firebase-Flutter-Konfigurations-Tutorial haben, lassen Sie es uns im Kommentarbereich unten wissen. Wenn Ihnen dieses Tutorial gefällt, liken und teilen Sie uns für weitere interessante Updates.