Compartir vía

Tutorial: Uso de la configuración dinámica en JavaScript

  • Artículo

En este tutorial, aprenderá a habilitar la configuración dinámica en las aplicaciones de JavaScript. El ejemplo de este tutorial se basa en la aplicación de ejemplo introducida en el inicio rápido de JavaScript. Antes de continuar, finalice Creación de una aplicación de JavaScript con Azure App Configuration.

Requisitos previos

Agregar pares de clave-valor

Agregue el siguiente par de clave-valor al almacén de Azure App Configuration. Para obtener más información sobre cómo agregar pares clave-valor a un almacén mediante Azure Portal o la CLI, vaya a Creación de un par clave-valor.

Clave Value Etiqueta Tipo de contenido
message Hola mundo Dejar en blanco Dejar en blanco

Aplicaciones de consola

En los ejemplos siguientes se muestra cómo usar valores de configuración actualizables en aplicaciones de consola. Elija las instrucciones siguientes en función de cómo la aplicación consume los datos de configuración cargados desde App Configuration, ya sea como un Map o un objeto de configuración.

Carga de datos desde App Configuration

Puede conectarse a App Configuration mediante Microsoft Entra ID (recomendado) o una cadena de conexión. El siguiente fragmento de código muestra cómo usar Microsoft Entra ID. Use DefaultAzureCredential para autenticarse en el almacén de App Configuration. Al completar el inicio rápido que se muestra en los requisitos previos, ya asignó a su credencial el rol de Lector de datos de App Configuration.

  1. Abra el archivo app.js y actualice la función load. Agregue un parámetro refreshOptions para habilitar las opciones de actualización y configurar la actualización. La configuración cargada se actualizará cuando se detecte un cambio en el servidor. De forma predeterminada, se usa un intervalo de actualización de 30 segundos, pero puede invalidarlo con la propiedad refreshIntervalInMs.

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

Nota:

Si recibe el error: "La actualización está activada, pero no se especifica ninguna configuración vigilada.", actualice el @azure/app-configuration-provider paquete a la versión 2.0.0 o posterior.

  1. La configuración de refreshOptions por sí sola no actualizará automáticamente la configuración. Debe llamar al método refresh para desencadenar una actualización. Este diseño evita solicitudes innecesarias a App Configuration cuando la aplicación está inactiva. Debe incluir la llamada refresh en la que se produce la actividad de la aplicación. Esto se conoce como actualización de configuración controlada por actividad. Por ejemplo, puede llamar a refresh al procesar un mensaje entrante o un pedido, o dentro de una iteración en la que se realiza una tarea compleja. Como alternativa, puede usar un temporizador si la aplicación siempre está activa. En este ejemplo, se llama a refresh en un bucle con fines de demostración. Incluso si se produce un error en la llamada a refresh por cualquier motivo, la aplicación seguirá usando la configuración almacenada en caché. Otro intento se realizará cuando se haya superado el intervalo de actualización configurado y la actividad de la aplicación desencadene la llamada a refresh. Llamar a refresh es una operación no operativa antes de que transcurre el intervalo de actualización configurado, por lo que su impacto en el rendimiento es mínimo incluso si se llama con frecuencia.

    Agregue el código siguiente para sondear los cambios de configuración de los valores de clave observados.

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

  2. Ahora el archivo app.js debería tener un aspecto similar al siguiente fragmento de código:

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

Ejecución de la aplicación

  1. Ejecute el script:

    node app.js

  2. Compruebe la salida:

    Hello World!

    Sigue imprimiendo "¡Hola mundo!" en una nueva línea cada 5 segundos.

  3. Actualice los siguientes pares de clave-valor en el almacén de Azure App Configuration. Actualice el valor de la clave message.

    Clave Value Etiqueta Tipo de contenido
    message ¡Hola mundo: actualizado! Dejar en blanco Dejar en blanco

  4. Una vez actualizados los valores, el valor actualizado se imprime después del intervalo de actualización.

    Hello World - Updated!

Aplicación de servidor

En el ejemplo siguiente se muestra cómo actualizar un servidor HTTP existente para usar valores de configuración actualizables.

  1. Cree un nuevo archivo javascript denominado server.js y agregue el siguiente 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. Ejecute el script:

    node server.js

  3. Visite http://localhost:3000 y verá la respuesta:

    Recorte de pantalla del explorador con un mensaje.

Carga de datos desde App Configuration

  1. Actualice server.js App Configuration y active la actualización 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());

Actualización de configuración controlada por solicitudes

En la mayoría de los casos, la operación de actualización del proveedor de App Configuration puede considerarse como un no operativa. Solo enviará solicitudes para comprobar el valor de App Configuration cuando se haya superado el tiempo de intervalo de actualización establecido.

Se recomienda implementar la actualización de configuración controlada por solicitudes para la aplicación web. La actualización de configuración se desencadena mediante las solicitudes entrantes a la aplicación web. No se producirá ninguna actualización si la aplicación está inactiva, cuando no hay ninguna solicitud entrante. Cuando la aplicación está activa, puedes usar un middleware o un mecanismo similar para desencadenar la appConfig.refresh() llamada en cada solicitud entrante a la aplicación.

  • Si se produce un error en una solicitud de detección de cambios de App Configuration, la aplicación seguirá utilizando la configuración almacenada en la caché. Los nuevos intentos de buscar cambios se realizarán periódicamente mientras haya nuevas solicitudes entrantes a la aplicación.

  • La actualización de la configuración se produce de forma asincrónica con respecto al procesamiento de las solicitudes entrantes de la aplicación. No bloqueará ni ralentizará la solicitud entrante que desencadenó la actualización. Es posible que no se actualicen los valores de configuración de la solicitud que desencadenó la actualización, pero sí lo harán las solicitudes posteriores.

Ejecución de la aplicación

  1. Vuelva a iniciar el servidor HTTP:

    node server.js

  2. Visite http://localhost:3000 y compruebe la respuesta que es la clave en el message almacén de App Configuration.

    Recorte de pantalla del explorador con un mensaje de App Configuration.

  3. Actualice los siguientes pares de clave-valor en el almacén de Azure App Configuration. Actualice el valor de la clave message.

    Clave Value Etiqueta Tipo de contenido
    message ¡Hola mundo: actualizado! Dejar en blanco Dejar en blanco

  4. Después de unos 15 segundos, actualice la página varias veces y el mensaje se debe actualizar.

    Recorte de pantalla del explorador con un mensaje actualizado de App Configuration.

Limpieza de recursos

Si no quiere seguir usando los recursos que se han creado en este artículo, elimine el grupo de recursos que creó aquí para evitar cargos.

Importante

La eliminación de un grupo de recursos es irreversible. El grupo de recursos y todos los recursos que contiene se eliminan permanentemente. Asegúrese de que no elimina por accidente el grupo de recursos o los recursos equivocados. Si creó los recursos para este artículo en un grupo de recursos que contenga los recursos que desee conservar, elimine cada recurso de forma individual desde su panel respectivo, en lugar de eliminar el grupo de recursos.

  1. Inicie sesión en Azure Portal y después seleccione Grupos de recursos.
  2. En el cuadro de texto Filtrar por nombre, escriba el nombre del grupo de recursos.
  3. En la lista resultados, seleccione el nombre del grupo de recursos para ver la información general.
  4. Seleccione Eliminar grupo de recursos.
  5. Se le pedirá que confirme la eliminación del grupo de recursos. Escriba el nombre del grupo de recursos para confirmar y seleccione Eliminar.

Transcurridos unos instantes, el grupo de recursos y todos sus recursos se eliminan.

Pasos siguientes

En este tutorial ha habilitado la aplicación de JavaScript para actualizar dinámicamente la configuración desde Azure App Configuration. Para aprender a usar una identidad administrada de Azure para simplificar el acceso a Azure App Configuration, vaya al siguiente tutorial.

Integración de identidades administradas

Para obtener la lista completa de características de la biblioteca del proveedor de configuración de JavaScript, consulte el siguiente documento.

Proveedor de configuración de JavaScript