教程：在 JavaScript 中使用动态配置

本教程介绍如何在 JavaScript 应用程序中启用动态配置。 本教程中的示例基于 JavaScript 快速入门中介绍的示例应用程序。 在继续之前，请先完成使用 Azure 应用程序配置创建 JavaScript 应用。

• 完成快速入门使用 Azure 应用程序配置创建 JavaScript 应用。
• 将 @azure/app-configuration-provider 包更新到版本 2.0.0 或更高版本。

将以下键值添加到 Azure 应用程序配置存储。 有关如何使用 Azure 门户或 CLI 将键值添加到存储区的详细信息，请转到创建键值。

以下示例演示如何在控制台应用程序中使用可刷新的配置值。 根据应用程序使用从应用程序配置加载的配置数据的方式（作为 Map 或配置对象）选择以下说明。

可以使用 Microsoft Entra ID（建议）或连接字符串连接到应用程序配置。 以下代码片段演示如何使用 Microsoft Entra ID。 请使用 DefaultAzureCredential 向应用程序配置存储区进行身份验证。 在完成先决条件中列出的快速入门时，你已经为凭据分配“应用程序配置数据读取者”角色。

1. 打开文件 app.js 并更新 load 函数。 添加 refreshOptions 参数以启用刷新并配置刷新选项。 当服务器上检测到更改时，将更新加载的配置。 默认使用 30 秒刷新间隔，但你可以使用 refreshIntervalInMs 属性重写此间隔。

   • 将配置用作映射
   • 将配置用作对象

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

1. 仅仅是设置 refreshOptions 不会自动刷新配置。 需要调用 refresh 方法来触发刷新。 此设计可防止应用程序处于空闲状态时对应用程序配置发出不必要的请求。 应在应用程序活动发生的位置包含 refresh 调用。 这称为活动驱动的配置刷新。 例如，可以在处理传入消息或订单时调用 refresh，或者在执行复杂任务的迭代过程中调用它。 或者，如果应用程序始终处于活动状态，则你可以使用计时器。 在此示例中，出于演示目的，在循环中调用了 refresh。 即使 refresh 调用因任何原因而失败，应用程序也将继续使用缓存的配置。 当配置的刷新间隔已过，并且应用程序活动触发 refresh 调用时，将进行另一次尝试。 在配置的刷新间隔过去之前调用 refresh 是一个空操作，因此，即使频繁调用，它的性能影响也很小。

   添加以下代码来轮询受监视键值的配置更改。

   • 将配置用作映射
   • 将配置用作对象

   // 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. 现在，文件 app.js 应类似于以下代码片段：

   • 将配置用作映射
   • 将配置用作对象

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

1. 运行脚本：

   node app.js
   

2. 验证输出：

   Hello World!
   

   它继续每隔 5 秒在新行中输出“Hello World！”。

3. 将以下键值更新到 Azure 应用程序配置存储。 更新键 message 的值。

   展开表

   密钥	值	标签	内容类型
   邮件	Hello World - 已更新！	留空	留空

4. 更新值后，将在刷新间隔后输出更新的值。

   Hello World - Updated!
   

以下示例演示如何更新现有 HTTP 服务器以使用可刷新的配置值。

1. 创建一 server.js 个名为并添加以下代码的新 JavaScript 文件：

   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. 运行脚本：

   node server.js
   

3. 访问 http://localhost:3000，你将看到以下响应：

   

1. 更新 server.js 以使用应用程序配置并启用动态刷新：

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

在大多数情况下，应用程序配置提供程序的刷新操作可视为无操作。 仅在你设置的刷新间隔时间过后，它才会发送请求来检查应用程序配置中的值。

我们建议为 Web 应用程序实现请求驱动的配置刷新。 配置刷新由对 Web 应用的传入请求触发。 如果应用处于空闲状态且没有请求传入，则不会发生刷新。 当应用处于活动状态时，可以使用中间件或类似机制在应用程序中每次传入请求时触发 appConfig.refresh() 调用。

• 如果向应用程序配置的更改检测请求失败，则应用将继续使用缓存的配置。 只要您的应用有新的传入请求，将会定期尝试检查是否有更改。

• 配置刷新与应用传入请求的处理异步进行。 它不会阻止或减缓触发刷新的传入请求。 触发刷新的请求可能不会得到更新的配置值，但是后面的请求会得到新的配置值。

1. 重新启动 HTTP 服务器：

   node server.js
   

2. 访问 http://localhost:3000 并验证响应（应用程序配置存储区中的 message 键）。

   

3. 将以下键值更新到 Azure 应用程序配置存储。 更新键 message 的值。

   展开表

   密钥	值	标签	内容类型
   邮件	Hello World - 已更新！	留空	留空

4. 大约 15 秒后，多次刷新页面，消息应该会更新。

   

如果不想继续使用本文中创建的资源，请删除此处创建的资源组以避免产生费用。

1. 登录到 Azure 门户，然后选择“资源组”。
2. 在“按名称筛选”框中，输入资源组的名称。
3. 在结果列表中，选择资源组名称以查看概述。
4. 选择“删除资源组”。
5. 系统会要求确认是否删除资源组。 重新键入资源组的名称进行确认，然后选择“删除”。

片刻之后，将会删除该资源组及其所有资源。

在本教程中，你已使 JavaScript 应用能够通过 Azure 应用程序配置动态刷新配置设置。 要了解如何使用 Azure 托管标识简化对 Azure 应用程序配置的访问，请继续学习下一教程。

有关 JavaScript 配置提供程序库的完整功能概要，请继续阅读以下文档。