如何在客户端动态更换DirectLine密钥并配置到机器人中？

我看你已经搭好了动态切换Direct Line密钥的初步框架，不过代码还有些不完整的地方，我帮你把这个方案补全并优化，让它能稳定运行：

首先先把你给出的代码片段补全并格式化，方便后续分析：

// 初始用临时密钥创建机器人连接
const initialBotConnection = new BotChat.DirectLine({ secret: 'secret1' });

// 监听机器人发来的事件，拿到新密钥后切换连接
initialBotConnection.activity$
  .filter(activity => activity.type === "event")
  .subscribe(activity => changeBotConnection(activity.value))

// 向机器人发送获取新密钥的请求
const changeSecret = () => {
  initialBotConnection
    .postActivity({ type: "event", value: "GetSecret", from: { id: "me" } })
    .subscribe(id => console.log('获取密钥请求已发送，ID:', id));
}

这个思路本身是可行的：先用临时/占位密钥启动机器人连接，再通过事件交互从应用后端拿到真实密钥，替换原有连接。但缺少核心的changeBotConnection实现，还有一些细节需要优化避免问题，下面是完整的可运行方案：

完整实现代码 #

// 声明全局变量存储当前机器人连接
let currentBotConnection = new BotChat.DirectLine({ secret: 'secret1' });

// 监听机器人返回的密钥事件，注意要过滤出包含有效密钥的事件
const activitySubscription = currentBotConnection.activity$
  .filter(activity => activity.type === "event" && activity.value?.secret)
  .subscribe(activity => {
    // 拿到新密钥后执行切换逻辑
    changeBotConnection(activity.value.secret);
    // 切换完成后取消原订阅，避免内存泄漏
    activitySubscription.unsubscribe();
  });

// 发送获取新密钥的请求函数
const fetchNewSecret = () => {
  currentBotConnection
    .postActivity({ 
      type: "event", 
      name: "GetSecret", // 用name字段标识事件类型，比单纯用value更规范
      from: { id: "user-" + Date.now() } // 给用户ID加时间戳，避免重复冲突
    })
    .subscribe(
      activityId => console.log('获取密钥请求已发送，ID:', activityId),
      error => console.error('发送请求失败:', error) // 增加错误捕获
    );
}

// 核心：切换机器人连接的函数
const changeBotConnection = (newSecret) => {
  // 先关闭原连接，释放资源
  currentBotConnection.end();
  
  // 创建新的DirectLine连接实例
  currentBotConnection = new BotChat.DirectLine({ secret: newSecret });
  
  // 更新BotChat UI的连接绑定（假设你的机器人UI挂载在id为bot-container的元素上）
  BotChat.render({
    directLine: currentBotConnection,
    user: { id: "user-" + Date.now() },
    bot: { id: "your-bot-id" } // 替换成你的机器人ID
  }, document.getElementById('bot-container'));
  
  console.log('已成功切换到新密钥的机器人连接');
}

// 页面加载完成后自动触发获取密钥的请求
window.addEventListener('load', fetchNewSecret);

关键优化点 #

• 事件规范：用name字段标识事件类型（比如"GetSecret"），比只用value更清晰，后端也更容易识别处理。
• 内存防护：切换连接后取消原activity$的订阅，并且调用end()关闭原连接，避免内存泄漏。
• 唯一性保障：给用户ID添加时间戳，避免同一页面多次加载时的ID冲突。
• 错误处理：给postActivity添加错误订阅分支，及时捕获请求失败的情况。

注意事项 #

• 临时密钥secret1必须是有效的（可以在Azure门户的Direct Line频道中生成临时密钥），否则初始连接会失败，无法发送获取密钥的请求。
• 如果是自定义机器人后端，需要在后端处理GetSecret事件，返回包含secret字段的event类型活动。

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