Início Rápido: Criar um aplicativo JavaScript com a Configuração de Aplicativos do Azure

Artigo
04/22/2024

Neste início rápido, você usará a Configuração de Aplicativos do Azure para centralizar o armazenamento e o gerenciamento de configurações de aplicativo usando a biblioteca de clientes do provedor JavaScript da Configuração de Aplicativo do Azure.

O provedor da Configuração de Aplicativos para JavaScript foi criado com base no SDK do Azure para JavaScript e projetado para ser mais fácil de usar com recursos mais avançados. Ele permite o acesso a valores de chave na Configuração de Aplicativos como um objeto Map. Oferece também recursos como composição de configuração com base em vários rótulos, corte de prefixo de chave, resolução automática de referências do Key Vault, entre outros. Por exemplo, este tutorial mostra como usar o provedor de JavaScript em um aplicativo Node.js.

Pré-requisitos

Uma conta do Azure com uma assinatura ativa. Crie um gratuitamente.
Um repositório de Configuração de Aplicativos. Criar um repositório.
Versões LTS do Node.js. Para obter informações sobre como instalar o Node.js diretamente no Windows ou usando o WSL (Subsistema do Windows para Linux), confira Introdução ao Node.js

Adicionar valores-chave

Adicione os seguintes valores-chave ao repositório de Configuração do Aplicativos. Para obter 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	Tipo de conteúdo
message	Mensagem da Configuração de Aplicativos do Azure	Deixar em branco
app.greeting	Olá, Mundo	Deixar em branco
app.json	{"myKey":"myValue"}	aplicativo/json

Criar um aplicativo de console Node.js

Neste tutorial, você criará um aplicativo de console Node.js e carregará os dados do repositório de Configuração de Aplicativos.

Crie um diretório para o projeto chamado app-configuration-quickstart.
```
mkdir app-configuration-quickstart
```
Mude para o diretório app-configuration-quickstart que foi recém-criado.
```
cd app-configuration-quickstart
```
Instale o provedor da Configuração de Aplicativos do Azure usando o comando npm install.
```
npm install @azure/app-configuration-provider
```

Conectar um repositório de Configuração de Aplicativos

Os exemplos a seguir demonstram como recuperar os dados de configuração da Configuração de Aplicativos do Azure e usá-los no seu aplicativo. Por padrão, os valores-chave são carregados como um objeto Map, permitindo que você acesse cada chave-valor usando seu nome de chave completo. Porém, se seu aplicativo usar objetos de configuração, você poderá usar a API auxiliar constructConfigurationObject que cria um objeto de configuração com base nos valores de chave carregados da Configuração de Aplicativos do Azure.

Crie um arquivo chamado app.js no diretório app-configuration-quickstart e copie o código de cada exemplo.

Exemplo 1: carregar a chave-valor com o seletor padrão

Neste exemplo, você se conecta à Configuração de Aplicativos do Azure usando uma cadeia de conexão e carrega valores-chave sem especificar opções avançadas. Por padrão, ele carrega todos os valores-chave sem rótulo.

const { load } = require("@azure/app-configuration-provider");
const connectionString = process.env.AZURE_APPCONFIG_CONNECTION_STRING;

async function run() {
    console.log("Sample 1: Load key-values with default selector");

    // Connect to Azure App Configuration using a connection string and load all key-values with null label.
    const settings = await load(connectionString);

    console.log("---Consume configuration as a Map---");
    // Find the key "message" and print its value.
    console.log('settings.get("message"):', settings.get("message"));           // settings.get("message"): Message from Azure App Configuration
    // Find the key "app.greeting" and print its value.
    console.log('settings.get("app.greeting"):', settings.get("app.greeting")); // settings.get("app.greeting"): Hello World
    // Find the key "app.json" whose value is an object.
    console.log('settings.get("app.json"):', settings.get("app.json"));         // settings.get("app.json"): { myKey: 'myValue' }

    console.log("---Consume configuration as an object---");
    // Construct configuration object from loaded key-values, by default "." is used to separate hierarchical keys.
    const config = settings.constructConfigurationObject();
    // Use dot-notation to access configuration
    console.log("config.message:", config.message);             // config.message: Message from Azure App Configuration
    console.log("config.app.greeting:", config.app.greeting);   // config.app.greeting: Hello World
    console.log("config.app.json:", config.app.json);           // config.app.json: { myKey: 'myValue' }
}

run().catch(console.error);

Exemplo 2: carregar valores de chave específicos usando seletores

Neste exemplo, você carrega um subconjunto de valores-chave especificando a opção selectors. Somente as chaves que começam com "app" são carregadas. Observe que você pode especificar vários seletores com base nas suas necessidades, cada um com propriedades keyFilter e labelFilter.

const { load } = require("@azure/app-configuration-provider");
const connectionString = process.env.AZURE_APPCONFIG_CONNECTION_STRING;

async function run() {
    console.log("Sample 2: Load specific key-values using selectors");

    // Load a subset of keys starting with "app." prefix.
    const settings = await load(connectionString, {
        selectors: [{
            keyFilter: "app.*"
        }],
    });

    console.log("---Consume configuration as a Map---");
    // The key "message" is not loaded as it does not start with "app."
    console.log('settings.has("message"):', settings.has("message"));           // settings.has("message"): false
    // The key "app.greeting" is loaded
    console.log('settings.has("app.greeting"):', settings.has("app.greeting")); // settings.has("app.greeting"): true
    // The key "app.json" is loaded
    console.log('settings.has("app.json"):', settings.has("app.json"));         // settings.has("app.json"): true

    console.log("---Consume configuration as an object---");
    // Construct configuration object from loaded key-values
    const config = settings.constructConfigurationObject({ separator: "." });
    // Use dot-notation to access configuration
    console.log("config.message:", config.message);         // config.message: undefined
    console.log("config.app.greeting:", config.app.greeting);   // config.app.greeting: Hello World
    console.log("config.app.json:", config.app.json);           // config.app.json: { myKey: 'myValue' }
}

run().catch(console.error);

Exemplo 3: carregar a chave-valor e cortar o prefixo de chaves

Neste exemplo, você carrega as valores-chave com uma opção trimKeyPrefixes. Depois que os valores-chave são carregados, o prefixo "app" é cortado de todas as chaves. Isso é útil quando você quer carregar configurações específicas do seu aplicativo filtrando por um determinado prefixo de chave, mas não quer que o código carregue o prefixo sempre que acessar a configuração.

const { load } = require("@azure/app-configuration-provider");
const connectionString = process.env.AZURE_APPCONFIG_CONNECTION_STRING;

async function run() {
    console.log("Sample 3: Load key-values and trim prefix from keys");

    // Load all key-values with no label, and trim "app." prefix from all keys.
    const settings = await load(connectionString, {
        selectors: [{
            keyFilter: "app.*"
        }],
        trimKeyPrefixes: ["app."]
    });

    console.log("---Consume configuration as a Map---");
    // The original key "app.greeting" is trimmed as "greeting".
    console.log('settings.get("greeting"):', settings.get("greeting")); // settings.get("greeting"): Hello World
    // The original key "app.json" is trimmed as "json".
    console.log('settings.get("json"):', settings.get("json"));         // settings.get("json"): { myKey: 'myValue' }

    console.log("---Consume configuration as an object---");
    // Construct configuration object from loaded key-values with trimmed keys.
    const config = settings.constructConfigurationObject();
    // Use dot-notation to access configuration
    console.log("config.greeting:", config.greeting);   // config.greeting: Hello World
    console.log("config.json:", config.json);           // config.json: { myKey: 'myValue' }
}

run().catch(console.error);

Executar o aplicativo

Defina uma variável de ambiente chamada AZURE_APPCONFIG_CONNECTION_STRING como a cadeia de conexão para seu repositório da Configuração de Aplicativos. Na linha de comando, execute o seguinte comando:
Para executar o aplicativo localmente usando o prompt de comando do Windows, execute o seguinte comando e substitua <app-configuration-store-connection-string> pela cadeia de conexão do repositório de configuração do aplicativo:
```
setx AZURE_APPCONFIG_CONNECTION_STRING "<app-configuration-store-connection-string>"
```
Se você usa o Windows PowerShell, execute o seguinte comando e substitua <app-configuration-store-connection-string> pela cadeia de conexão do repositório de configuração do aplicativo:
```
$Env:AZURE_APPCONFIG_CONNECTION_STRING = "<app-configuration-store-connection-string>"
```
Se você usa o macOS, execute o seguinte comando e substitua <app-configuration-store-connection-string> pela cadeia de conexão do repositório de configuração do aplicativo:
```
export AZURE_APPCONFIG_CONNECTION_STRING='<app-configuration-store-connection-string>'
```
Se você usa Linux, execute o seguinte comando e substitua <app-configuration-store-connection-string> pela cadeia de conexão do repositório de configuração do aplicativo:
```
export AZURE_APPCONFIG_CONNECTION_STRING='<app-configuration-store-connection-string>'
```
Imprima o valor da variável de ambiente para validar se ela estiver definida corretamente com o comando a seguir.
Usando o prompt de comando do Windows, reinicie o prompt de comando para permitir que a alteração entre em vigor e execute o seguinte comando:
```
echo %AZURE_APPCONFIG_CONNECTION_STRING%
```
Se você usa o Windows PowerShell, execute o comando a seguir:
```
$Env:AZURE_APPCONFIG_CONNECTION_STRING
```
Se você usar o macOS, execute o seguinte comando:
```
echo "$AZURE_APPCONFIG_CONNECTION_STRING"
```
Se você usar o Linux, execute o seguinte comando:
```
echo "$AZURE_APPCONFIG_CONNECTION_STRING"
```

Depois que a variável de ambiente for definida de maneira correta, execute o seguinte comando para executar o aplicativo localmente:

node app.js

Você deverá ver a seguinte saída de cada exemplo:

Amostra 1

Sample 1: Load key-values with default selector
---Consume configuration as a Map---
settings.get("message"): Message from Azure App Configuration
settings.get("app.greeting"): Hello World
settings.get("app.json"): { myKey: 'myValue' }
---Consume configuration as an object---
config.message: Message from Azure App Configuration
config.app.greeting: Hello World
config.app.json: { myKey: 'myValue' }

Amostra 2

Sample 2: Load specific key-values using selectors
---Consume configuration as a Map---
settings.has("message"): false
settings.has("app.greeting"): true
settings.has("app.json"): true
---Consume configuration as an object---
config.message: undefined
config.app.greeting: Hello World
config.app.json: { myKey: 'myValue' }

Amostra 3

Sample 3: Load key-values and trim prefix from keys
---Consume configuration as a Map---
settings.get("greeting"): Hello World
settings.get("json"): { myKey: 'myValue' }
---Consume configuration as an object---
config.greeting: Hello World
config.json: { myKey: 'myValue' }

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.

Entre no portal do Azure e selecione Grupos de recursos.
Na caixa Filtrar por nome..., digite o nome do seu grupo de recursos.
Na lista de resultados, selecione o nome do grupo de recursos para conferir uma visão geral.
Selecione Excluir grupo de recursos.
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 início rápido, você criou um repositório da Configuração de Aplicativos e aprendeu a acessar valores de chave usando o provedor de JavaScript da Configuração de Aplicativos em um aplicativo Node.js. Para saber como configurar seu aplicativo para que as configurações sejam atualizadas dinamicamente, prossiga para o próximo tutorial.

Habilitar configuração dinâmica

Compartilhar via