Freigeben über


Tutorial: Verwenden der dynamischen Konfiguration in JavaScript

In diesem Tutorial erfahren Sie, wie Sie die dynamische Konfiguration in Ihren JavaScript-Anwendungen aktivieren. Das Beispiel in diesem Tutorial basiert auf der Beispielanwendung, die in der JavaScript-Schnellstartanleitung eingeführt wurde. Bevor Sie fortfahren, beenden Sie das Erstellen einer JavaScript-App mit Azure App Configuration.

Voraussetzungen

Schlüsselwerte hinzufügen

Fügen Sie dem Azure App Configuration-Speicher die folgenden Schlüssel-Wert-Paare hinzu. Weitere Informationen zum Hinzufügen von Schlüssel-Wert-Paaren zu einem Speicher mithilfe des Azure-Portals oder der CLI finden Sie unter Erstellen eines Schlüssel-Wert-Paars.

Schlüssel Wert Bezeichnung Inhaltstyp
Nachricht Hallo Welt! Leer lassen Leer lassen

Konsolenanwendungen

Die folgenden Beispiele zeigen, wie Sie aktualisierbare Konfigurationswerte in Konsolenanwendungen verwenden. Wählen Sie die folgenden Anweisungen basierend darauf aus, wie Ihre Anwendung Konfigurationsdaten nutzt, die aus der App-Konfiguration geladen wurden, entweder als Map oder als Konfigurationsobjekt.

Laden von Daten aus App Configuration

Sie können eine Verbindung mit App Configuration entweder mithilfe von Microsoft Entra ID (empfohlen) oder mit einer Verbindungszeichenfolge herstellen. Der folgende Codeausschnitt veranschaulicht die Verwendung von Microsoft Entra ID. Sie verwenden „DefaultAzureCredential“ für die Authentifizierung beim App Configuration-Speicher. Nachdem Sie die in den Voraussetzungen aufgeführte Schnellstartanleitung abgeschlossen haben, haben Sie Ihren Anmeldeinformationen bereits die Rolle „App Configuration-Datenleser“ zugewiesen.

  1. Öffnen Sie die Datei app.js und aktualisieren Sie die load-Funktion. Fügen Sie einen refreshOptions-Parameter hinzu, um die Aktualisierungsoptionen zu aktivieren und zu konfigurieren. Die geladene Konfiguration wird aktualisiert, wenn eine Änderung auf dem Server erkannt wird. Standardmäßig wird ein Aktualisierungsintervall von 30 Sekunden verwendet, Sie können es jedoch mit der refreshIntervalInMs-Eigenschaft überschreiben.

    // Connecting to Azure App Configuration using endpoint and token credential
    const appConfig = await load(endpoint, credential, {
        // Enabling the dynamic refresh
        refreshOptions: {
            enabled: true
        }
    });
    

    Hinweis

    Wenn die Fehlermeldung „Aktualisierung ist aktiviert, aber es wurden keine überwachten Einstellungen angegeben.“, aktualisieren Sie das @azure/app-configuration-provider-Paket auf Version 2.0.0 oder höher.

    Tipp

    Weitere Informationen zum Überwachen von Konfigurationsänderungen finden Sie unter Bewährte Methoden für die Aktualisierung der Konfiguration.

  2. Das Einrichten von refreshOptions allein aktualisiert die Konfiguration nicht automatisch. Sie müssen die refresh-Methode aufrufen, um eine Aktualisierung auszulösen. Dieses Design verhindert unnötige Anforderungen an die App-Konfiguration, wenn ihre Anwendung im Leerlauf ist. Sie sollten den Aufruf refresh dort verwenden, wo Ihre Anwendungsaktivität auftritt. Dies wird als aktivitätsgesteuerte Konfigurationsaktualisierung bezeichnet. Sie können z. B. refresh beim Verarbeiten einer eingehenden Nachricht oder einer Bestellung oder innerhalb einer Iteration aufrufen, in der Sie eine komplexe Aufgabe ausführen. Alternativ können Sie einen Timer verwenden, wenn Ihre Anwendung immer aktiv ist. In diesem Beispiel wird refresh zu Demonstrationszwecken in einer Schleife aufgerufen. Selbst wenn der refresh-Aufruf aus einem beliebigen Grund fehlschlägt, verwendet Ihre Anwendung weiterhin die zwischengespeicherte Konfiguration. Ein weiterer Versuch wird unternommen, wenn das konfigurierte Aktualisierungsintervall verstrichen ist und der refresh-Aufruf von Ihrer Anwendungsaktivität ausgelöst wird. Das Aufrufen von refresh ist vor Verstreichen des konfigurierten Aktualisierungsintervalls keine Option. Daher sind die Auswirkungen auf die Leistung minimal, auch wenn der Aufruf häufig erfolgt.

    Fügen Sie den folgenden Code hinzu, um Konfigurationsänderungen von überwachten Schlüsselwerten abzufragen.

    // Polling for configuration changes every 5 seconds
    while (true) {
        console.log(appConfig.get("message")); // Consume current value of message from a Map
        appConfig.refresh(); // Refreshing the configuration setting asynchronously
        await sleepInMs(5000); // Waiting before the next refresh
    }
    
  3. Nun sollte die Datei app.js wie der folgende Codeausschnitt aussehen:

    const sleepInMs = require("util").promisify(setTimeout);
    const { load } = require("@azure/app-configuration-provider");
    const { DefaultAzureCredential } = require("@azure/identity");
    const endpoint = process.env.AZURE_APPCONFIG_ENDPOINT;
    const credential = new DefaultAzureCredential(); // For more information, see https://learn.microsoft.com/azure/developer/javascript/sdk/credential-chains#use-defaultazurecredential-for-flexibility
    
    async function run() {
        // Connecting to Azure App Configuration using endpoint and token credential
        const appConfig = await load(endpoint, credential, {
            // Enabling the dynamic refresh
            refreshOptions: {
                enabled: true
            }
        });
    
        // Polling for configuration changes every 5 seconds
        while (true) {
            console.log(appConfig.get("message")); // Consume current value of message from a Map
            appConfig.refresh(); // Refreshing the configuration setting asynchronously
            await sleepInMs(5000); // Waiting before the next refresh
        }
    }
    
    run().catch(console.error);
    

Ausführen der Anwendung

  1. Führen Sie Ihr Skript aus:

    node app.js
    
  2. Überprüfen der Ausgabe:

    Hello World!
    

    Es wird weiterhin alle 5 Sekunden in einer neuen Zeile „Hello World!“ gedruckt.

  3. Aktualisieren Sie die folgenden Schlüsselwerte im Azure App Configuration-Speicher. Der Wert des Schlüssels message wird aktualisiert.

    Schlüssel Wert Bezeichnung Inhaltstyp
    Nachricht Hallo Welt - aktualisiert! Leer lassen Leer lassen
  4. Nachdem die Werte aktualisiert wurden, wird der aktualisierte Wert nach dem Aktualisierungsintervall gedruckt.

    Hello World - Updated!
    

Serveranwendung

Das folgende Beispiel zeigt, wie ein vorhandenr HTTP-Server aktualisiert wird, um aktualisierbare Konfigurationswerte zu verwenden.

  1. Erstellen Sie eine neue JavaScript-Datei namens server.js , und fügen Sie den folgenden Code hinzu:

    const http = require('http');
    
    function startServer() {
        const server = http.createServer((req, res) => {
            res.statusCode = 200;
            res.setHeader('Content-Type', 'text/plain');
            res.end("Hello World!");
        });
    
        const hostname = "localhost";
        const port = 3000;
        server.listen(port, hostname, () => {
        console.log(`Server running at http://localhost:${port}/`);
        });
    }
    
    startServer();
    
  2. Führen Sie Ihr Skript aus:

    node server.js
    
  3. Besuchen Sie http://localhost:3000, und Sie werden die Antwort sehen:

    Screenshot des Browsers mit einer Nachricht.

Laden von Daten aus App Configuration

  1. Aktualisieren Sie server.js, um die App-Konfiguration zu verwenden und die dynamische Aktualisierung zu aktivieren:

    const http = require("http");
    
    const { load } = require("@azure/app-configuration-provider");
    const { DefaultAzureCredential } = require("@azure/identity");
    const endpoint = process.env.AZURE_APPCONFIG_ENDPOINT;
    const credential = new DefaultAzureCredential(); // For more information, see https://learn.microsoft.com/azure/developer/javascript/sdk/credential-chains#use-defaultazurecredential-for-flexibility
    
    let appConfig;
    async function initializeConfig() {
        appConfig = await load(endpoint, credential, {
            refreshOptions: {
                enabled: true,
                refreshIntervalInMs: 15_000 // set the refresh interval
            }
        });
    }
    
    function startServer() {
        const server = http.createServer((req, res) => {
            // refresh the configuration asynchronously when there is any incoming request
            appConfig.refresh();
            res.statusCode = 200;
            res.setHeader('Content-Type', 'text/plain');
            res.end(appConfig.get("message"));
        });
    
        const hostname = "localhost";
        const port = 3000;
        server.listen(port, hostname, () => {
        console.log(`Server running at http://localhost:${port}/`);
        });
    }
    
    // Initialize the configuration and then start the server
    initializeConfig()
        .then(() => startServer());
    

Anforderungsgesteuerte Konfigurationsaktualisierung

In den meisten Fällen kann der Aktualisierungsvorgang des Appkonfigurationsanbieters als Nulloperation behandelt werden. Es sendet nur Anforderungen, um den Wert in der Appkonfiguration zu überprüfen, wenn die von Ihnen festgelegte Aktualisierungszeit überschritten wurde.

Wir empfehlen die Implementierung der anforderungsgesteuerten Konfigurationsaktualisierung für Ihre Webanwendung. Die Konfigurationsaktualisierung wird durch die eingehenden Anforderungen an Ihre Web-App ausgelöst. Wenn ihre App inaktiv ist, tritt keine Aktualisierung auf, wenn keine Anforderung eingehend ist. Wenn Ihre App aktiv ist, können Sie eine Middleware oder einen ähnlichen Mechanismus verwenden, um den appConfig.refresh()-Aufruf bei jeder eingehenden Anforderung an Ihre Anwendung auszulösen.

  • Tritt bei einer an App Configuration gesendeten Änderungserkennungsanforderung ein Fehler auf, wird von Ihrer App weiterhin die zwischengespeicherte Konfiguration verwendet. In regelmäßigen Abständen werden neue Versuche unternommen, nach Änderungen zu suchen, während neue Anfragen bei Ihrer App eingehen.

  • Die Konfigurationsaktualisierung wird asynchron zur Verarbeitung der eingehenden Anforderungen Ihrer App durchgeführt. Die eingehende Anforderung, durch die die Aktualisierung ausgelöst wurde, wird nicht blockiert oder verlangsamt. Die Anforderung, durch die die Aktualisierung ausgelöst wurde, erhält möglicherweise nicht die aktualisierten Konfigurationswerte, nachfolgende Anforderungen dagegen schon.

Ausführen der Anwendung

  1. Starten Sie Ihren HTTP-Server neu:

    node server.js
    
  2. Besuchen Sie http://localhost:3000 und überprüfen Sie die Antwort, die der message-Schlüssel im Appkonfigurationsspeicher ist.

    Screenshot des Browsers mit einer Meldung aus der Appkonfiguration.

  3. Aktualisieren Sie die folgenden Schlüsselwerte im Azure App Configuration-Speicher. Der Wert des Schlüssels message wird aktualisiert.

    Schlüssel Wert Bezeichnung Inhaltstyp
    Nachricht Hallo Welt - aktualisiert! Leer lassen Leer lassen
  4. Aktualisieren Sie die Seite nach etwa 15 Sekunden mehrmals, und die Nachricht sollte aktualisiert werden.

    Screenshot des Browsers mit einer aktualisierten Nachricht aus der Appkonfiguration.

Bereinigen von Ressourcen

Wenn Sie die in diesem Artikel erstellten Ressourcen nicht mehr verwenden möchten, löschen Sie die erstellte Ressourcengruppe, um Kosten zu vermeiden.

Wichtig

Das Löschen einer Ressourcengruppe kann nicht rückgängig gemacht werden. Die Ressourcengruppe und alle darin enthaltenen Ressourcen werden unwiderruflich gelöscht. Achten Sie daher darauf, dass Sie nicht versehentlich die falsche Ressourcengruppe oder die falschen Ressourcen löschen. Falls Sie die Ressourcen für diesen Artikel in einer Ressourcengruppe erstellt haben, die andere beizubehaltende Ressourcen enthält, löschen Sie die Ressourcen einzeln über den entsprechenden Bereich, statt die Ressourcengruppe zu löschen.

  1. Melden Sie sich beim Azure-Portal an, und klicken Sie auf Ressourcengruppen.
  2. Geben Sie im Feld Nach Name filtern den Namen Ihrer Ressourcengruppe ein.
  3. Wählen Sie in der Ergebnisliste den Ressourcengruppennamen aus, um eine Übersicht anzuzeigen.
  4. Wählen Sie die Option Ressourcengruppe löschen.
  5. Sie werden aufgefordert, das Löschen der Ressourcengruppe zu bestätigen. Geben Sie zur Bestätigung den Namen Ihrer Ressourcengruppe ein, und klicken Sie auf Löschen.

Daraufhin werden die Ressourcengruppe und alle darin enthaltenen Ressourcen gelöscht.

Nächste Schritte

In diesem Tutorial haben Sie Ihre JavaScript-App aktiviert, um Konfigurationseinstellungen dynamisch aus Azure App Configuration zu aktualisieren. Fahren Sie mit dem nächsten Tutorial fort, um zu erfahren, wie Sie eine von Azure verwaltete Identität hinzufügen, um den Zugriff auf Azure App Configuration zu optimieren.

Eine vollständige Übersicht über die JavaScript-Konfigurationsanbieterbibliothek finden Sie im folgenden Dokument.