React中使用Token实现Rocket Chat Iframe自动登录失败问题

我正在开发一款集成Rocket Chat聊天功能的应用，已通过DigitalOcean Marketplace将Rocket Chat部署至Droplet。尝试用Rocket Chat的令牌登录功能实现Iframe免登录，但始终跳转至登录页面。登录后功能正常，希望通过Rocket Chat SDK生成的令牌跳过登录页面直接完成认证。补充说明：我在Rocket Chat设置中留空了Iframe URL和Api URL。

我的React代码如下：

const ChatComponent: React.FC = (token) => {
    const iframeUrl = 'http://111.111.111.111:3000/channel/general';
    const init = () => {
        const iframe = document.getElementById('rocketchat-iframe') as HTMLIFrameElement;
        iframe.contentWindow?.postMessage({
            externalCommand: 'login-with-token',
            loginToken: token
        }, '*');
    }
    return (
        <>
            <iframe
                title="Rocket.Chat"
                src={iframeUrl}
                id="rocketchat-iframe"
                width="100%"
                height="500"
                style={{ border: 'none', overflow: 'hidden' }}
                onLoad={init}
            />
        </>
    );
};

export default ChatComponent;

• 配置Rocket Chat的Iframe信任域名
  留空Iframe URL和Api URL是核心问题，Rocket Chat需要明确信任嵌入它的父页面域名，否则会拦截postMessage的登录指令。进入Rocket Chat后台管理 > 设置 > 权限 > Iframe Integration：

  • 填写Iframe URL为你的应用域名（本地开发填http://localhost:3000，线上填实际应用域名）
  • Api URL填写Rocket Chat的访问地址（比如http://111.111.111.111:3000）
    保存设置后重启Rocket Chat服务。

• 限制postMessage的目标域名
  代码中postMessage用*作为目标域名存在安全风险，且可能被Rocket Chat的安全策略拦截，改为Rocket Chat的实际地址：

  iframe.contentWindow?.postMessage({
      externalCommand: 'login-with-token',
      loginToken: token
  }, 'http://111.111.111.111:3000');
  

• 验证令牌有效性
  确认SDK生成的令牌有效，且对应用户有权访问/channel/general频道。可通过调用Rocket Chat的GET /api/v1/me接口验证令牌是否能正常获取用户信息。

• 调整消息发送时机
  onLoad触发时Rocket Chat页面可能未完全初始化，导致无法接收消息，可添加延迟：

  const init = () => {
      const iframe = document.getElementById('rocketchat-iframe') as HTMLIFrameElement;
      setTimeout(() => {
          iframe.contentWindow?.postMessage({
              externalCommand: 'login-with-token',
              loginToken: token
          }, 'http://111.111.111.111:3000');
      }, 1000);
  }
  

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