Bereitstellung von Funktionen für Zielgruppen in einer Node.js-Anwendung

In diesem Leitfaden verwenden Sie den Zielfilter, um ein Feature für Zielgruppen für Ihre Node.js-Anwendung bereitstellen zu können. Weitere Informationen zum Zielfilter finden Sie unter Rollout von Features für Zielgruppen.

Voraussetzungen

Ein Azure-Konto mit einem aktiven Abonnement. Erstellen Sie ein kostenloses Konto.
Ein App-Konfigurationsspeicher, wie in der Anleitung zum Erstellen eines Speichers gezeigt.
Ein Betafunktion-Flag mit Zielgruppenfilter. Erstellen Sie das Featureflag.
LTS-Versionen von Node.js.

Erstellen einer Webanwendung mit einem Featureflag

In diesem Abschnitt erstellen Sie eine Webanwendung, die das Betafeature-Flag verwendet, um den Zugriff auf die Betaversion einer Webseite zu steuern.

Einrichten eines Node.js Express-Projekts

Erstellen Sie einen Ordner namens targeting-filter-tutorial und initialisieren Sie das Projekt.
```
mkdir targeting-filter-tutorial
cd targeting-filter-tutorial
npm init -y
```

Installieren Sie die folgenden Pakete.

npm install @azure/app-configuration-provider
npm install @microsoft/feature-management
npm install express

Erstellen Sie eine neue Datei mit dem Namen app.js , und fügen Sie den folgenden Code hinzu.

const express = require("express");
const server = express();
const port = "8080";

server.listen(port, () => {
    console.log(`Server is running at http://localhost:${port}`);
});

Herstellen einer Verbindung mit der Azure-App-Konfiguration

Aktualisieren Sie die app.js , und fügen Sie den folgenden Code hinzu.

// Existing code ...
const appConfigEndpoint = process.env.AZURE_APPCONFIG_ENDPOINT;
const { DefaultAzureCredential } = require("@azure/identity");
const { load } = require("@azure/app-configuration-provider");
const { FeatureManager, ConfigurationMapFeatureFlagProvider } = require("@microsoft/feature-management");

let appConfig;
let featureManager;

async function initializeConfig() {
    // Load feature flags from App Configuration.
    appConfig = await load(appConfigEndpoint, new DefaultAzureCredential(), {
        featureFlagOptions: {
            enabled: true,
            refresh: {
                enabled: true
            }
        }
    });

    // Create feature manager with feature flag provider that accesses feature flags from App Configuration.
    featureManager = new FeatureManager(
        new ConfigurationMapFeatureFlagProvider(appConfig));
}

// Use a middleware to refresh the configuration before each request.
server.use((req, res, next) => {
    appConfig.refresh();
    next();
});
// Existing code ...

Sie stellen eine Verbindung mit der Azure App-Konfiguration her, um Featurekennzeichnungen zu laden, die automatische Aktualisierung zu aktivieren und später ein FeatureManager Objekt für den Zugriff auf Featurekennzeichnungen zu erstellen. Vor jeder Anforderung wird eine Middleware hinzugefügt, um die Konfiguration zu aktualisieren.

Aktualisieren Sie den Code, um sicherzustellen, dass der Express-Server erst gestartet wird, nachdem die Konfiguration erfolgreich initialisiert wurde.

// Existing code ...
initializeConfig()
    .then(() => {
        // Start the express server.
        server.listen(port, () => {
            console.log(`Server is running at http://localhost:${port}`);
        });
    })

Verwenden des Featureflags

Fügen Sie der dateiapp.js den folgenden Code hinzu, um den Routenhandler für den Express-Server zu konfigurieren. Der Server dient unterschiedlichen Inhalten basierend darauf, ob das Beta-Feature-Flag aktiviert ist.

// Existing code ...
server.get("/", async (req, res) => {
    const isBetaEnabled = await featureManager.isEnabled("Beta");
    const [title, message] = isBetaEnabled 
        ? ["Beta Page", "This is a beta page."]
        : ["Home Page", "Welcome."];
    
    res.send(
        `<!DOCTYPE html>
        <html>
            <head><title>${title}</title></head>
            <body style="display: flex; justify-content: center; align-items: center; min-height: 100vh; margin: 0;">
                <h1 style="text-align: center; font-size: 5rem;">${message}</h1>
            </body>
        </html>`
    );
});

initializeConfig()
// Existing code ...

Aktivieren der Zielbestimmung für die Webanwendung

Ein Zielkontext ist erforderlich, wenn Features mit aktivierter Zielbestimmung ausgewertet werden. Um diesen Kontext explizit für die Featureauswertung bereitzustellen, können Sie ihn als Parameter an die featureManager.isEnabled Methode übergeben.

const isBetaEnabled = await featureManager.isEnabled("Beta", { userId: "UserA", groups: ["Group1"] });

In einer Webanwendung kann der Zielkontext auch als Umgebungskontext bereitgestellt werden, indem die ITargetingContextAccessor-Schnittstelle implementiert wird. Ein Umgebungsadressierungskontext bedeutet, dass Zielinformationen automatisch aus der Umgebung abgerufen werden, z. B. die aktuelle HTTP-Anforderung, ohne sie explizit an jeden featureManager.isEnabled() Aufruf übergeben zu müssen.

Sie verwenden den Umgebungsadressierungskontext in diesem Lernprogramm.

Fügen Sie den folgenden Code nach der Express-Serverdeklaration hinzu. Es wird AsyncLocalStorage verwendet, um die aktuelle Anforderung zu speichern, sodass der Feature-Manager den Zielkontext automatisch über einen Zielkontextaccessorrückruf abrufen kann. Weitere Informationen finden Sie unter Verwenden von AsyncLocalStorage für den Anforderungskontext.

const express = require("express");
const server = express();
const port = 8080;

const { AsyncLocalStorage } = require("async_hooks");
const requestAccessor = new AsyncLocalStorage();
// Use a middleware to store request context.
server.use((req, res, next) => {
    // Store the request in AsyncLocalStorage for this request chain.
    requestAccessor.run(req, () => {
        next();
    });
});

// Create a targeting context accessor that retrieves user data from the current request.
const targetingContextAccessor = {
    getTargetingContext: () => {
        // Get the current request from AsyncLocalStorage.
        const request = requestAccessor.getStore();
        if (!request) {
            return undefined;
        }
        const { userId, groups } = request.query;
        return {
            userId: userId,
            groups: groups ? groups.split(",") : [] 
        };
    }
};
// Existing code ...

Übergeben Sie beim Erstellen des FeatureManager den Zielkontext-Accessor an den FeatureManagerOptions.

featureManager = new FeatureManager(
    new ConfigurationMapFeatureFlagProvider(appConfig),
    {
        targetingContextAccessor: targetingContextAccessor
    });

Nach Abschluss der vorherigen Schritte sollte ihre app.js Datei nun die folgende vollständige Implementierung enthalten.

const express = require("express");
const server = express();
const port = 8080;

const { AsyncLocalStorage } = require("async_hooks");
const requestAccessor = new AsyncLocalStorage();
// Use a middleware to store request context
server.use((req, res, next) => {
    // Store the request in AsyncLocalStorage for this request chain
    requestAccessor.run(req, () => {
        next();
    });
});

// Create a targeting context accessor that retrieves user data from the current request
const targetingContextAccessor = {
    getTargetingContext: () => {
        // Get the current request from AsyncLocalStorage
        const request = requestAccessor.getStore();
        if (!request) {
            return undefined;
        }
        const { userId, groups } = request.query;
        return {
            userId: userId,
            groups: groups ? groups.split(",") : [] 
        };
    }
};

const appConfigEndpoint = process.env.AZURE_APPCONFIG_ENDPOINT;
const { DefaultAzureCredential } = require("@azure/identity");
const { load } = require("@azure/app-configuration-provider");
const { FeatureManager, ConfigurationMapFeatureFlagProvider } = require("@microsoft/feature-management");

let appConfig;
let featureManager;

async function initializeConfig() {
    // Load feature flags from App Configuration.
    appConfig = await load(appConfigEndpoint, new DefaultAzureCredential(), {
        featureFlagOptions: {
            enabled: true,
            refresh: {
                enabled: true
            }
        }
    });

    // Create feature manager with feature flag provider that accesses feature flags from App Configuration and targeting context accessor.
    featureManager = new FeatureManager(
        new ConfigurationMapFeatureFlagProvider(appConfig),
        {
            targetingContextAccessor: targetingContextAccessor
        });
}

// Use a middleware to refresh the configuration before each request
server.use((req, res, next) => {
    appConfig.refresh();
    next();
});

server.get("/", async (req, res) => {
    const isBetaEnabled = await featureManager.isEnabled("Beta");
    const [title, message] = isBetaEnabled 
        ? ["Beta Page", "This is a beta page."]
        : ["Home Page", "Welcome."];
    
    res.send(
        `<!DOCTYPE html>
        <html>
            <head><title>${title}</title></head>
            <body style="display: flex; justify-content: center; align-items: center; min-height: 100vh; margin: 0;">
                <h1 style="text-align: center; font-size: 5rem;">${message}</h1>
            </body>
        </html>`
    );
});

// Initialize the configuration and start the server
initializeConfig()
    .then(() => {
        // Start the express server.
        server.listen(port, () => {
            console.log(`Server is running at http://localhost:${port}`);
        });
    })

Zielfilter in Aktion

Legen Sie die Umgebungsvariable namens AZURE_APPCONFIG_ENDPOINT auf den Endpunkt Ihres App-Konfigurationsspeichers fest, der unter der Übersicht über Ihren Store im Azure-Portal zu finden ist.

Führen Sie bei Verwendung einer Windows-Eingabeaufforderung den folgenden Befehl aus, und starten Sie die Eingabeaufforderung neu, damit die Änderung wirksam wird:
```
setx AZURE_APPCONFIG_ENDPOINT "<endpoint-of-your-app-configuration-store>"
```
Wenn Sie PowerShell verwenden, führen Sie den folgenden Befehl aus:
```
$Env:AZURE_APPCONFIG_ENDPOINT = "<endpoint-of-your-app-configuration-store>"
```
Führen Sie bei Verwendung von macOS oder Linux den folgenden Befehl aus:
```
export AZURE_APPCONFIG_ENDPOINT='<endpoint-of-your-app-configuration-store>'
```
Führen Sie die Anwendung aus.
```
node app.js
```
Öffnen Sie Ihren Browser und gehen Sie zu localhost:8080. Die Standardansicht der App sollte angezeigt werden.
1. Fügen Sie userId als Abfrageparameter in der URL hinzu, um die Benutzer-ID anzugeben. Besuchen Sie localhost:8080/?userId=test@contoso.com. Sie sehen die Betaseite, weil test@contoso.com als Zielbenutzer angegeben ist.
Besuchen Sie localhost:8080/?userId=testuser@contoso.com. Die Betaseite kann nicht angezeigt werden, da testuser@contoso.com als ausgeschlossener Benutzer angegeben ist.

Nächste Schritte

Wenn Sie mehr über die Featurefilter erfahren möchten, fahren Sie mit den folgenden Dokumenten fort.

Aktivieren bedingter Features mit Featurefiltern

Aktivieren von Features nach einem Zeitplan

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

.NET-Featureverwaltung

Feedback

War diese Seite hilfreich?

Last updated on 2025-07-24