Implementar funcionalidades para públicos-alvo em um aplicativo Node.js.

Neste guia, você usará o filtro de direcionamento para distribuir um recurso para públicos-alvo para seu aplicativo Node.js. Para obter mais informações sobre o filtro de destino, consulte Distribuir recursos para públicos-alvo.

Pré-requisitos

Uma conta do Azure com uma assinatura ativa. Crie um gratuitamente.
Um repositório de Configuração de Aplicativos, conforme mostrado no tutorial para criar um repositório.
Um sinalizador de recurso Beta com filtro de direcionamento. Crie o sinalizador de recurso.
Versões LTS do Node.js.

Crie um aplicativo Web com um sinalizador de recurso

Nesta seção, você criará um aplicativo Web que usa o sinalizador de recurso Beta para controlar o acesso à versão beta de uma página da Web.

Configurar um projeto do Node.js Express

Crie uma pasta chamada targeting-filter-tutorial e inicialize o projeto.

mkdir targeting-filter-tutorial
cd targeting-filter-tutorial
npm init -y

Instale os seguintes pacotes.

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

Crie um novo arquivo chamado app.js e adicione o código a seguir.

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

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

Conectar-se à Configuração de Aplicativos do Azure

Atualize o app.js e adicione o código a seguir.

// 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 ...

Conecte-se à Configuração de Aplicativos do Azure para carregar sinalizadores de recursos, habilitar a atualização automática e criar um FeatureManager objeto para acessar sinalizadores de recursos posteriormente. Um middleware é adicionado para atualizar a configuração antes de cada solicitação.

Atualize o código para garantir que o servidor Express seja iniciado somente depois que a configuração tiver sido inicializada com êxito.

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

Usar o sinalizador de recurso

Adicione o código a seguir ao arquivo app.js para configurar o manipulador de rotas para o servidor Express. O servidor fornecerá conteúdos diferentes com base em se o sinalizador de recurso Beta está habilitado.

// 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 ...

Habilitar o direcionamento para o aplicativo Web

Um contexto de direcionamento é necessário ao avaliar os recursos com o direcionamento habilitado. Para fornecer explicitamente esse contexto para avaliação de recursos, você pode passá-lo como um parâmetro para o featureManager.isEnabled método.

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

Em um aplicativo Web, o contexto de direcionamento também pode ser fornecido como um contexto ambiente implementando a interface ITargetingContextAccessor . Um contexto de direcionamento ambiente significa que as informações de destino são recuperadas automaticamente do ambiente, como a solicitação HTTP atual, sem a necessidade de passá-la explicitamente para cada featureManager.isEnabled() chamada.

Você usa o contexto de direcionamento ambiental neste tutorial.

Adicione o código a seguir após a declaração do servidor Express. Ele usa AsyncLocalStorage para armazenar a solicitação atual e isso permite que o gerenciador de recursos recupere automaticamente o contexto de destino por meio de um retorno de chamada do acessador de contexto de direcionamento. Para obter mais detalhes, consulte Como usar AsyncLocalStorage para o contexto de solicitação.

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 ...

Ao construir o FeatureManager, passe o acessador de contexto de direcionamento para o FeatureManagerOptions.

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

Depois de concluir as etapas anteriores, o arquivo app.js agora deve conter a seguinte implementação completa.

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

Filtro de direcionamento em ação

Defina a variável de ambiente denominada AZURE_APPCONFIG_ENDPOINT para o ponto de extremidade do repositório de Configuração de Aplicativos encontrado na Visão Geral do seu repositório no portal do Azure.

Se você usar o prompt de comando do Windows, execute o comando a seguir e reinicie o prompt de comando para permitir que a alteração entre em vigor:
```
setx AZURE_APPCONFIG_ENDPOINT "<endpoint-of-your-app-configuration-store>"
```
Se você usar o PowerShell, execute o seguinte comando:
```
$Env:AZURE_APPCONFIG_ENDPOINT = "<endpoint-of-your-app-configuration-store>"
```
Se você usa macOS ou Linux, execute o comando a seguir:
```
export AZURE_APPCONFIG_ENDPOINT='<endpoint-of-your-app-configuration-store>'
```
Execute o aplicativo.
```
node app.js
```
Abra o navegador e navegue até localhost:8080. Você deve ver o modo de exibição padrão do aplicativo.
1. Adicione userId como um parâmetro de consulta na URL para especificar a ID do usuário. Acesse localhost:8080/?userId=test@contoso.com. Você vê a página beta, porque test@contoso.com é especificado como usuário de destino.
Acesse localhost:8080/?userId=testuser@contoso.com. Não é possível ver a página beta, pois testuser@contoso.com é especificado como um usuário excluído.

Próximas etapas

Para saber mais sobre os filtros de recursos, confira os documentos a seguir.

Habilitar recursos condicionais com filtros de recursos

Habilitar os recursos em um agendamento

Para ver o resumo completo da biblioteca de gerenciamento de recursos JavaScript, continue para o documento a seguir.

Gerenciamento de recursos .NET

Comentários

Esta página foi útil?

Last updated on 2025-07-23