如何向对接MSBOT的React应用及ServiceNow托管Bot传递浏览器属性？

1. 向交互的React应用传递浏览器属性 #

你已经找到的这个基于Redux中间件的方案非常靠谱，核心逻辑就是在Web Chat和Direct Line连接完成后，发送自定义的webchat/join事件，把浏览器属性和用户信息同步给Bot。

这里再补充几个实用细节：

• 监听DIRECT_LINE/CONNECT_FULFILLED是最稳妥的时机，确保连接完全建立后再发事件，避免消息丢失
• 你用window.navigator.language获取浏览器语言是标准操作，还可以扩展传递其他浏览器属性，比如window.navigator.userAgent（浏览器UA）、window.screen.width/height（屏幕分辨率）等
• 延迟1秒是个保险的做法，如果你的连接速度很快，也可以尝试缩短，但建议保留一定缓冲时间确保事件能成功送达

2. ServiceNow托管Bot时提取邮箱并传递 #

既然用户已经用同一邮箱登录ServiceNow，我们可以直接从ServiceNow的页面环境中提取邮箱值，替换你代码里硬编码的"a.b@c.d"，实现类SSO的效果。具体操作如下：

步骤1：从ServiceNow页面提取邮箱

ServiceNow通常会把当前登录用户的信息存在全局变量window.g_user里，其中就包含邮箱字段email，这是最可靠的方式。如果全局变量不可用，再考虑从页面DOM元素中提取（需要根据你的ServiceNow页面结构调整选择器）。

步骤2：修改代码动态注入邮箱

把你现有的代码调整为动态获取邮箱，替换硬编码值：

if (action.type === 'DIRECT_LINE/CONNECT_FULFILLED') {
  setTimeout(() => {
    // 优先使用ServiceNow全局变量提取邮箱（推荐）
    const userEmail = window.g_user?.email || 'fallback@example.com';
    
    // 备选方案：如果全局变量不可用，从DOM元素提取（示例选择器，需根据实际页面调整）
    // const userEmail = document.querySelector('.sn-global-header-user-email')?.textContent.trim() || 'fallback@example.com';

    dispatch({
      type: 'WEB_CHAT/SEND_EVENT',
      payload: {
        name: 'webchat/join',
        value: {
          language: window.navigator.language,
          userid: userEmail,
          username: userEmail
        }
      }
    });
  }, 1000);
} else if (action.type === 'DIRECT_LINE/INCOMING_ACTIVITY') {
  if (action.payload.activity.from.role === 'bot') {
    this.setState(() => ({ newMessage: true }));
  }
}
return next(action);
});

注意事项

• 先测试window.g_user是否可用：打开浏览器控制台输入window.g_user，确认能看到包含email的用户对象
• 如果用DOM选择器，一定要在ServiceNow页面中找到准确的元素选择器，避免提取失败
• 加上 fallback 值（比如fallback@example.com），防止提取失败导致Bot交互异常
• 确保你的React应用是嵌入在ServiceNow页面内的（比如通过iframe或自定义页面组件），这样才能访问到ServiceNow的全局变量和DOM元素

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