Megjegyzés
Az oldalhoz való hozzáféréshez engedély szükséges. Megpróbálhat bejelentkezni vagy módosítani a címtárat.
Az oldalhoz való hozzáféréshez engedély szükséges. Megpróbálhatja módosítani a címtárat.
Ebben az útmutatóban a célzási szűrő segítségével fogja bevezetni a funkciót az Ön Node.js-alkalmazásának célzott közönségei számára. A célzási szűrővel kapcsolatos további információkért lásd : Szolgáltatások bevezetése a célközönségek számára.
Előfeltételek
- Egy Azure-fiók, aktív előfizetéssel. Hozzon létre egyet ingyen.
- Egy alkalmazáskonfigurációs áruház, ahogyan az egy áruház létrehozására vonatkozó oktatóanyagban is látható.
- Béta funkciójelző célzási szűrővel. Hozza létre a funkciójelzőt.
- Node.js LTS-verziók.
Webalkalmazás létrehozása funkciójelölővel
Ebben a szakaszban egy webalkalmazást hoz létre, amely a bétaverziós funkciójelzővel szabályozza a weblap bétaverzióhoz való hozzáférését.
Node.js Express-projekt beállítása
Hozzon létre egy mappát,
targeting-filter-tutorialés inicializálja a projektet.mkdir targeting-filter-tutorial cd targeting-filter-tutorial npm init -yTelepítse a következő csomagokat.
npm install @azure/app-configuration-provider npm install @microsoft/feature-management npm install expressHozzon létre egy app.js nevű új fájlt, és adja hozzá a következő kódot.
const express = require("express"); const server = express(); const port = "8080"; server.listen(port, () => { console.log(`Server is running at http://localhost:${port}`); });
Csatlakozás az Azure-alkalmazáskonfigurációhoz
Frissítse a app.js , és adja hozzá a következő kódot.
// 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 ...Az Azure App Configurationhoz csatlakozva betöltheti a funkciójelzőket, engedélyezheti az automatikus frissítést, és létrehozhat egy
FeatureManagerobjektumot a funkciójelzők későbbi eléréséhez. A rendszer minden kérés előtt hozzáad egy köztes szoftvereket a konfiguráció frissítéséhez.Frissítse a kódot, hogy az Express-kiszolgáló csak a konfiguráció sikeres inicializálása után induljon el.
// Existing code ... initializeConfig() .then(() => { // Start the express server. server.listen(port, () => { console.log(`Server is running at http://localhost:${port}`); }); })
A funkciójelző használata
Adja hozzá a következő kódot a app.js fájlhoz az Express-kiszolgáló útvonalkezelőjének konfigurálásához. A kiszolgáló különböző tartalmakat fog kiszolgálni attól függően, hogy engedélyezve van-e a bétaverzió funkciójelzője.
// 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 ...
Célzás engedélyezése a webalkalmazáshoz
Célzási környezetre van szükség a funkciók célzás engedélyezve történő kiértékelésekor. Ha kifejezetten meg szeretné adni ezt a környezetet a funkcióértékeléshez, paraméterként továbbíthatja azt a featureManager.isEnabled metódusnak.
const isBetaEnabled = await featureManager.isEnabled("Beta", { userId: "UserA", groups: ["Group1"] });
A webalkalmazásokban a célkörnyezet környezeti környezetként is megadható az ITargetingContextAccessor felület implementálásával . A környezeti célzási környezet azt jelenti, hogy a célzási információk automatikusan lekérhetők a környezetből, például az aktuális HTTP-kérésből, anélkül, hogy külön át kellene adni azokat az egyes featureManager.isEnabled() hívásoknak.
Ebben az oktatóanyagban környezeti célzási környezetet használ.
Adja hozzá a következő kódot az Express server deklarációja után. Az aktuális kérés tárolására szolgál
AsyncLocalStorage, lehetővé téve, hogy a szolgáltatáskezelő automatikusan lekérje a célzási környezetet egy célkörnyezeti kiegészítő visszahívásával. További részletekért lásd: Az AsyncLocalStorage használata a kérelemkörnyezethez.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 ...A
FeatureManagerkonstruktálásakor adja át a célzási kontextus elérőt aFeatureManagerOptions.featureManager = new FeatureManager( new ConfigurationMapFeatureFlagProvider(appConfig), { targetingContextAccessor: targetingContextAccessor });
Az előző lépések elvégzése után a app.js fájlnak tartalmaznia kell a következő teljes implementációt.
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}`);
});
})
Célzási szűrő működés közben
Állítsa a AZURE_APPCONFIG_ENDPOINT nevű környezeti változót az Alkalmazáskonfigurációs áruház végpontjára, amely az Azure Portalon található áruház áttekintésében található.
Ha a Windows parancssorát használja, futtassa a következő parancsot, és indítsa újra a parancssort a módosítás érvénybe lépésének engedélyezéséhez:
setx AZURE_APPCONFIG_ENDPOINT "<endpoint-of-your-app-configuration-store>"Ha a PowerShellt használja, futtassa a következő parancsot:
$Env:AZURE_APPCONFIG_ENDPOINT = "<endpoint-of-your-app-configuration-store>"MacOS vagy Linux használata esetén futtassa a következő parancsot:
export AZURE_APPCONFIG_ENDPOINT='<endpoint-of-your-app-configuration-store>'Indítsa el az alkalmazást.
node app.jsNyissa meg a böngészőt, és navigáljon a
localhost:8080címre. Az alkalmazás alapértelmezett nézetének kell megjelennie.
-
- Adja hozzá
userIdlekérdezési paraméterként az URL-címhez a felhasználói azonosító megadásához. Látogasson ellocalhost:8080/?userId=test@contoso.com. Megjelenik a bétaoldal, merttest@contoso.comcélfelhasználóként van megadva.
- Adja hozzá
Látogasson el
localhost:8080/?userId=testuser@contoso.com. A bétaoldal nem látható, merttestuser@contoso.comkizárt felhasználóként van megadva.
Következő lépések
A funkciószűrőkről a következő dokumentumokban olvashat bővebben.
A JavaScript szolgáltatásfelügyeleti kódtár teljes funkciólefutásához folytassa a következő dokumentumot.