Tutorial: Usar a configuração dinâmica no JavaScript

Neste tutorial, você aprenderá como habilitar a configuração dinâmica nos 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 de Aplicativos do Azure.

Pré-requisitos

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

Adicionar valores-chave

Adicione os seguintes valores-chave ao repositório da Configuração de Aplicativos do Azure. Para mais informações sobre como adicionar valores-chave a um repositório usando o portal do Azure ou a CLI, acesse Criar um valor-chave.

Chave	Valor	Rótulo	Tipo de conteúdo
message	Olá, Mundo!	Deixar em branco	Deixar em branco

Aplicativos de console

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 de Aplicativos, como um Map ou um objeto de configuração.

Carregar os dados da Configuração de Aplicativos

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

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

   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 configuração como objeto

   O objeto de configuração será construído ao chamar a função constructConfigurationObject. Para garantir uma configuração atualizada, atualize o objeto de configuração no retorno de chamada de onRefresh disparado sempre que uma alteração de configuração for detectada 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();
   });
   
   

Observação

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

1. A própria configuração de refreshOptions não atualizará automaticamente a configuração. Você precisa chamar o método refresh para disparar uma atualização. Esse design impede solicitações desnecessárias para a Configuração de Aplicativos quando o aplicativo está ocioso. Você deve incluir a chamada refresh onde ocorre a atividade do aplicativo. Isso é conhecido como atualização de configuração controlada por atividade. Por exemplo, você pode chamar refresh ao processar uma mensagem de entrada ou um pedido ou dentro de uma iteração na qual que você executa uma tarefa complexa. Como alternativa, você poderá usar um temporizador se o aplicativo estiver sempre ativo. Nesse exemplo, refresh é chamado em um loop para fins de demonstração. Mesmo que a chamada refresh falhe por algum motivo, seu aplicativo continuará usando a configuração armazenada em cache. Outra tentativa será feita quando o intervalo de atualização configurado tiver passado e a chamada refresh for disparada pela atividade do aplicativo. Chamar refresh é uma não operação antes que o intervalo de atualização configurado decorra, portanto, seu impacto no desempenho é mínimo, mesmo se essa chamada é realizada com frequência.

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

   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 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 arquivo app.js deve ser semelhante ao seguinte snippet 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 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 o aplicativo

1. Executar o script:

   node app.js
   

2. Verificar a saída:

   Hello World!
   

   Ele continua a imprimir "Olá, Mundo!" em uma nova linha a cada 5 segundos.

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

   Chave	Valor	Rótulo	Tipo de conteúdo
   message	Olá, Mundo – 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!
   

Aplicativo para servidores

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

1. Crie um 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. Executar o script:

   node server.js
   

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

   

Carregar os dados da Configuração de Aplicativos

1. Atualize o server.js para usar a Configuração de Aplicativos e habilitar a 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 controlada por solicitação

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

Recomendamos implementar a atualização de configuração controlada por solicitação para seu aplicativo Web. A atualização de configuração é disparada pelas solicitações de entrada ao aplicativo Web. Nenhuma atualização ocorrerá se o aplicativo estiver ocioso, quando não houver solicitações recebidas. Quando o aplicativo estiver ativo, você poderá usar um middleware ou mecanismo semelhante para disparar a chamada appConfig.refresh() a cada solicitação recebida pelo aplicativo.

• Se uma solicitação à Configuração de Aplicativos para detecção de alterações falhar, o aplicativo continuará a usar a configuração armazenada em cache. Novas tentativas de verificar se há alterações serão feitas periodicamente enquanto houver novas solicitações de entrada no aplicativo.

• A atualização de configuração ocorre de forma assíncrona para o processamento das solicitações de entrada do aplicativo. Ela não bloqueará nem reduzirá a velocidade da solicitação de entrada que disparou a atualização. Talvez a solicitação que disparou a atualização não receba os valores de configuração atualizados, mas solicitações posteriores receberão.

Executar o aplicativo

1. Reinicie o servidor http:

   node server.js
   

2. Visite http://localhost:3000 e verifique a resposta que é a chave message no repositório de Configuração de Aplicativos.

   

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

   Chave	Valor	Rótulo	Tipo de conteúdo
   message	Olá, Mundo – Atualizado!	Deixar em branco	Deixar em branco

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

   

Limpar os recursos

Se não deseja continuar usando os recursos criados neste artigo, exclua o grupo de recursos que você criou aqui para evitar encargos.

Importante

A exclusão de um grupo de recursos é irreversível. O grupo de recursos e todos os recursos contidos nele são excluídos permanentemente. Não exclua acidentalmente grupo de recursos ou recursos incorretos. Se tiver criado os recursos para este artigo dentro de um grupo de recursos que contém outros recursos que você deseja manter, exclua cada um individualmente do respectivo 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..., digite o nome do seu grupo de recursos.
3. Na lista de resultados, selecione o nome do grupo de recursos para conferir uma visão geral.
4. Selecione Excluir grupo de recursos.
5. Você receberá uma solicitação para confirmar a exclusão do grupo de recursos. Insira o nome do grupo de recursos para confirmar e selecione Excluir.

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

Próximas etapas

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

Integração de identidade gerenciada

Para obter uma descrição completa dos recursos da biblioteca de provedores de configuração do JavaScript, consulte o documento a seguir.

Provedor de configuração do JavaScript