如何在iframe中嵌入无开关按钮的Rocket.chat Omnichannel在线客服

要在iframe中嵌入Rocket.chat Omnichannel并隐藏开关按钮，仅保留聊天布局，你可以通过以下几种方式调整：

1. 修改iframe的URL参数 #

Rocket.chat Omnichannel支持通过URL参数控制界面显示逻辑，直接调整src路径即可：

'use client';
import React from 'react';

export const Support = () => {
  return (
    <div>
      <h1 className="text-4xl font-semibold mb-10">Support</h1>

      <iframe
        src="https://chat.exemple.com/livechat?embedded=true&hideCloseButton=true"
        title="Chat"
        frameBorder="0"
        style={{ width: '100%', height: '800px', zIndex: '1300', overflow: 'auto' }}
      ></iframe>
    </div>
  );
};

参数说明：

• embedded=true：强制启用嵌入布局，适配iframe场景
• hideCloseButton=true：直接隐藏开关/关闭按钮

部分版本的Rocket.chat还支持专用嵌入路径，效果更稳定：

src="https://chat.exemple.com/livechat/embedded"

这个路径默认加载嵌入模式，不会显示开关按钮。

2. 后台配置兜底 #

如果URL参数不生效，登录Rocket.chat管理后台做全局配置：

• 进入Omnichannel > Settings > Livechat Widget
• 开启「Embedded Mode」（嵌入模式）
• 关闭「Show Close Button」（显示关闭按钮）选项
• 保存设置后刷新页面即可生效

3. 样式优化（可选） #

原代码中的scrolling="no"可能导致聊天内容被截断，建议改用overflow: auto让iframe自动适配滚动，提升用户体验。

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