Azure App Configuration JS SDK特性标记缓存及请求优化咨询

由于Azure App Configuration JS SDK暂时没有内置的缓存配置方法，你可以通过以下几种方案手动实现缓存、减少对Azure服务的请求次数：

1. 手动实现内存缓存 #

这是最直接的方案，在应用内维护一个缓存对象，存储特性标记数据及过期时间，每次请求前先检查缓存有效性。

// 全局缓存对象，存储特性标记和过期时间
let featureFlagsCache = {
  data: null,
  expiresAt: 0
};

async function fetchFeatureFlags() {
  const now = Date.now();
  // 缓存未过期则直接返回
  if (featureFlagsCache.data && now < featureFlagsCache.expiresAt) {
    return featureFlagsCache.data;
  }

  // 从Azure App Configuration拉取最新数据
  const { AzureAppConfigurationClient } = require("@azure/app-configuration");
  const client = new AzureAppConfigurationClient(process.env.AZURE_APP_CONFIG_CONNECTION_STRING);
  
  const settingsIterator = client.listConfigurationSettings({
    filter: "tag:featureflag" // 过滤特性标记类型的配置项
  });

  const flags = {};
  for await (const setting of settingsIterator) {
    flags[setting.key] = JSON.parse(setting.value);
  }

  // 设置缓存有效期（示例为5分钟）
  featureFlagsCache = {
    data: flags,
    expiresAt: now + 5 * 60 * 1000
  };

  return flags;
}

• 适用场景：单实例部署的Next.js应用、对特性标记更新延迟容忍度较高的场景
• 注意：在Next.js客户端组件中不要直接暴露Azure连接字符串，建议通过API路由封装这个逻辑。

2. 利用Next.js的ISR/SSG缓存 #

如果你的页面是静态或可增量生成的，可以结合Next.js的增量静态再生（ISR）或静态站点生成（SSG），在页面构建时拉取特性标记并缓存页面内容。

// 页面组件的getStaticProps方法
export async function getStaticProps() {
  const flags = await fetchFeatureFlags();
  return {
    props: { flags },
    revalidate: 300 // 每5分钟重新生成页面，更新特性标记
  };
}

• 适用场景：静态页面、不需要实时更新特性标记的场景
• 优势：无需额外维护缓存逻辑，由Next.js自动处理页面缓存和更新。

3. 结合Azure事件网格实现推送刷新 #

如果需要特性标记更新后及时生效，可以配置Azure事件网格，当配置项变更时主动通知Next.js应用，触发缓存清除。

1. 在Azure Portal中给App Configuration配置事件订阅，指向你的Next.js API路由
2. 编写API路由处理刷新请求：

// pages/api/refresh-feature-flags.js
export default async function handler(req, res) {
  // 验证请求来自Azure事件网格（可通过签名验证确保安全性）
  if (req.method === 'POST') {
    // 清除内存缓存
    featureFlagsCache = { data: null, expiresAt: 0 };
    res.status(200).json({ message: "缓存已清除" });
  } else {
    res.status(405).json({ message: "不支持的请求方法" });
  }
}

• 适用场景：需要实时更新特性标记的场景
• 优势：避免无效的轮询请求，仅在配置变更时更新缓存。

4. 使用外部缓存存储（如Redis） #

如果是多实例部署的Next.js应用，内存缓存会存在实例间不一致的问题，此时可以用Redis等分布式缓存统一存储特性标记。

const Redis = require("ioredis");
const redis = new Redis(process.env.REDIS_URL);

async function fetchFeatureFlags() {
  const cachedData = await redis.get("app-config-feature-flags");
  const now = Date.now();

  if (cachedData) {
    const { data, expiresAt } = JSON.parse(cachedData);
    if (now < expiresAt) {
      return data;
    }
  }

  // 从Azure拉取数据（同内存缓存逻辑）
  const client = new AzureAppConfigurationClient(process.env.AZURE_APP_CONFIG_CONNECTION_STRING);
  const settingsIterator = client.listConfigurationSettings({ filter: "tag:featureflag" });
  const flags = {};
  for await (const setting of settingsIterator) {
    flags[setting.key] = JSON.parse(setting.value);
  }

  // 将数据存入Redis，设置5分钟过期
  await redis.set("app-config-feature-flags", JSON.stringify({
    data: flags,
    expiresAt: now + 5 * 60 * 1000
  }));

  return flags;
}

• 适用场景：多实例部署、需要缓存一致性的场景
• 优势：所有实例共享同一缓存，避免重复请求Azure服务。

内容的提问来源于stack exchange，提问作者Omid W