Tutorial: Usar configuração dinâmica em JavaScript

Neste tutorial, você aprenderá a habilitar a configuração dinâmica em seus aplicativos JavaScript. O exemplo neste tutorial baseia-se no aplicativo de exemplo introduzido no início rápido do JavaScript. Antes de continuar, conclua Criar um aplicativo JavaScript com a Configuração do Aplicativo do Azure.

Pré-requisitos

• Conclua o início rápido Crie um aplicativo JavaScript com a Configuração do Aplicativo do Azure.
• Atualize o pacote para a @azure/app-configuration-provider versão 2.0.0 ou posterior.

Adicionar valores-chave

Adicione o seguinte valor-chave à sua loja de Configuração de Aplicações do Azure. Para obter mais informações sobre como adicionar valores-chave a uma loja usando o portal do Azure ou a CLI, vá para Criar um valor-chave.

Key	valor	Etiqueta	Tipo do conteúdo
mensagem	Olá, mundo!	Deixar em branco	Deixar em branco

Aplicações de consola

Os exemplos a seguir mostram como usar valores de configuração atualizáveis em aplicativos de console. Escolha as instruções a seguir com base em como seu aplicativo consome dados de configuração carregados da Configuração do aplicativo, como um Map objeto de configuração ou de configuração.

Carregar dados da Configuração do Aplicativo

Você pode se conectar à Configuração do Aplicativo usando o ID do Microsoft Entra (recomendado) ou uma cadeia de conexão. O trecho de código a seguir demonstra o uso do Microsoft Entra ID. Você usa o DefaultAzureCredential para autenticar em sua loja de Configuração de Aplicativos. Ao concluir o início rápido listado nos pré-requisitos, você já atribuiu sua credencial à função Leitor de Dados de Configuração do Aplicativo.

1. Abra o arquivo app.js e atualize a load função. Adicione um refreshOptions parâmetro para habilitar as opções de atualização e configuração. A configuração carregada será atualizada quando uma alteração for detetada no servidor. Por padrão, um intervalo de atualização de 30 segundos é usado, mas você pode substituí-lo pela refreshIntervalInMs propriedade.

   Usar configuração como Mapa

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

   Usar a configuração como objeto

   O objeto de configuração é construído chamando constructConfigurationObject a função. Para garantir uma configuração atualizada, atualize o onRefresh objeto de configuração no retorno de chamada acionado sempre que uma alteração de configuração for detetada e a configuração for atualizada.

   // Connecting to Azure App Configuration using endpoint and token credential
   const appConfig = await load(endpoint, credential, {
       // Enabling the dynamic refresh
       refreshOptions: {
           enabled: true
       }
   });
   
   // Constructing configuration object
   let config = appConfig.constructConfigurationObject();
   
   // Setting up callback to ensure `config` object is updated once configuration is changed.
   appConfig.onRefresh(() => {
       config = appConfig.constructConfigurationObject();
   });
   
   

Nota

Se você receber o erro: "Atualizar está ativado, mas nenhuma configuração monitorada é especificada.", atualize o pacote para a @azure/app-configuration-provider versão 2.0.0 ou posterior.

1. A configuração refreshOptions sozinha não atualizará automaticamente a configuração. Você precisa chamar o refresh método para disparar uma atualização. Esse design evita solicitações desnecessárias à Configuração do Aplicativo quando seu aplicativo está ocioso. Você deve incluir a chamada onde a atividade do refresh aplicativo ocorre. Isso é conhecido como atualização de configuração orientada por atividade. Por exemplo, você pode ligar refresh ao processar uma mensagem de entrada ou um pedido, ou dentro de uma iteração onde você executa uma tarefa complexa. Como alternativa, você pode usar um temporizador se seu aplicativo estiver sempre ativo. Neste exemplo, refresh é chamado em um loop para fins de demonstração. Mesmo que a refresh chamada falhe por qualquer motivo, seu aplicativo continuará a usar a configuração em cache. Outra tentativa será feita quando o intervalo de atualização configurado tiver passado e a chamada for acionada pela atividade do refresh aplicativo. A chamada refresh é um no-op antes do intervalo de atualização configurado passar, portanto, seu impacto no desempenho é mínimo, mesmo que seja chamado com frequência.

   Adicione o código a seguir para sondar as alterações de configuração dos valores-chave monitorados.

   Usar configuração como Mapa

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

   Usar a configuração como objeto

   // Polling for configuration changes every 5 seconds
   while (true) {
       console.log(config.message); // Consume current value of message from an object
       appConfig.refresh(); // Refreshing the configuration setting asynchronously
       await sleepInMs(5000); // Waiting before the next refresh
   }
   

2. Agora, o app.js do arquivo deve se parecer com o seguinte trecho de código:

   Usar configuração como Mapa

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

   Usar a configuração como objeto

   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
           }
       });
   
       // Constructing configuration object
       let config = appConfig.constructConfigurationObject();
   
       // Setting up callback to ensure `config` object is updated once configuration is changed.
       appConfig.onRefresh(() => {
           config = appConfig.constructConfigurationObject();
       });
   
       // Polling for configuration changes every 5 seconds
       while (true) {
           console.log(config.message); // Consume current value of message from an object
           appConfig.refresh(); // Refreshing the configuration setting asynchronously
           await sleepInMs(5000); // Waiting before the next refresh
       }
   }
   
   run().catch(console.error);
   

Executar a aplicação

1. Execute o script:

   node app.js
   

2. Verificar saída:

   Hello World!
   

   Continua a imprimir "Hello World!" numa nova linha a cada 5 segundos.

3. Atualize os seguintes valores-chave para o repositório de Configuração de Aplicativos do Azure. Atualizar valor da chave message.

   Key	valor	Etiqueta	Tipo do conteúdo
   mensagem	Hello World - Atualizado!	Deixar em branco	Deixar em branco

4. Depois que os valores são atualizados, o valor atualizado é impresso após o intervalo de atualização.

   Hello World - Updated!
   

Aplicação de servidor

O exemplo a seguir mostra como atualizar um servidor http existente para usar valores de configuração atualizáveis.

1. Crie um novo arquivo javascript chamado server.js e adicione o seguinte código:

   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. Execute o script:

   node server.js
   

3. Visite http://localhost:3000 e você verá a resposta:

   

Carregar dados da Configuração do Aplicativo

1. Atualize o para usar a Configuração do Aplicativo e habilite a server.js atualização dinâmica:

   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());
   

Atualização de configuração orientada por solicitação

Na maioria dos casos, a operação de atualização do provedor de Configuração de Aplicativo pode ser tratada como um no-op. Ele só enviará solicitações para verificar o valor na Configuração do Aplicativo quando o tempo do intervalo de atualização definido tiver passado.

Recomendamos a implementação da atualização de configuração orientada por solicitação para seu aplicativo Web. A atualização da configuração é acionada pelas solicitações de entrada para seu aplicativo Web. Nenhuma atualização ocorrerá se seu aplicativo estiver ocioso, quando não houver nenhuma solicitação recebida. Quando seu aplicativo está ativo, você pode usar um middleware ou mecanismo semelhante para disparar a appConfig.refresh() chamada em cada solicitação de entrada para seu aplicativo.

• Se uma solicitação à Configuração do Aplicativo para deteção de alterações falhar, seu aplicativo continuará a usar a configuração em cache. Novas tentativas de verificar alterações serão feitas periodicamente enquanto houver novas solicitações de entrada para seu aplicativo.

• A atualização de configuração acontece de forma assíncrona para o processamento das solicitações de entrada do seu aplicativo. Ele não bloqueará ou retardará a solicitação de entrada que disparou a atualização. A solicitação que disparou a atualização pode não obter os valores de configuração atualizados, mas as solicitações posteriores obterão novos valores de configuração.

Executar a aplicação

1. Reinicie o seu servidor http:

   node server.js
   

2. Visite http://localhost:3000 e verifique a resposta, que é a message chave na sua App Configuration Store.

   

3. Atualize os seguintes valores-chave para o repositório de Configuração de Aplicativos do Azure. Atualizar valor da chave message.

   Key	valor	Etiqueta	Tipo do conteúdo
   mensagem	Hello World - Atualizado!	Deixar em branco	Deixar em branco

4. Após cerca de 15 segundos, atualize a página várias vezes e a mensagem deve ser atualizada.

   

Clean up resources (Limpar recursos)

Se não quiser continuar a utilizar os recursos criados neste artigo, elimine o grupo de recursos que criou aqui para evitar cobranças.

Importante

A eliminação de um grupo de recursos é irreversível. O grupo de recursos e todos os recursos nele contidos são excluídos permanentemente. Certifique-se de não excluir acidentalmente o grupo de recursos ou recursos errados. Se você criou os recursos para este artigo dentro de um grupo de recursos que contém outros recursos que deseja manter, exclua cada recurso individualmente de seu respetivo painel em vez de excluir o grupo de recursos.

1. Entre no portal do Azure e selecione Grupos de recursos.
2. Na caixa Filtrar por nome, introduza o nome do seu grupo de recursos.
3. Na lista de resultados, selecione o nome do grupo de recursos para ver uma visão geral.
4. Selecione Eliminar grupo de recursos.
5. É-lhe pedido que confirme a eliminação do grupo de recursos. Insira o nome do grupo de recursos a ser confirmado e selecione Excluir.

Após alguns momentos, o grupo de recursos e todos os seus recursos são excluídos.

Próximos passos

Neste tutorial, você habilitou seu aplicativo JavaScript para atualizar dinamicamente as definições de configuração da Configuração do Aplicativo do Azure. Para saber como usar uma identidade gerenciada do Azure para simplificar o acesso à Configuração do Aplicativo do Azure, continue para o próximo tutorial.

Integração de identidade gerenciada

Para obter o resumo completo dos recursos da biblioteca do provedor de configuração JavaScript, continue para o documento a seguir.

Provedor de configuração JavaScript