iframe网页内嵌集成
背景
观远BI平台支持仪表板以iframe内嵌集成的方式嵌入到第三方系统内。iframe内嵌集成需要关注的点包括：
-
SSO单点登录 (请参考观远BI-SSO集成)
-
仪表板上多余内容（例如logo栏、仪表板目录、页面标题等）隐藏
-
通过URL传递页面查询参数（请参考页面URL添加条件参数）
一. PC 端页面多余内容隐藏
- BI系统内原生的页面带有Logo栏、仪表板导航栏等信息，这些内容在将页面集成到第三方系统后往往是需要隐藏掉的。观远提供了一些特定的URL查询参数，可以把这些多余的信息隐藏掉。
技术手段：iframe 内嵌；URL 中增加 Query String （查询字符串）
PC 端页面常用参数
-
?ps=iframe 仪表板页面隐藏logo栏、仪表板目录
-
?ps=iframe2 仪表板页面隐藏logo栏、仪表板目录和页面标题栏
-
?ps=iframe3 仪表板页面隐藏logo栏
-
?viewMode=readonly 隐藏页面和卡片编辑操作，使用户权限暂时变为只读
-
?ps=embed 卡片详情页隐藏除可视化图表之外的其他所有内容
URL格式示例：https://app.guandata.com/page/b81ee1f66f3934de1ba5e447?ps=iframe
当ps参数不为embed时，嵌入卡片是最小宽度为500像素。
二. 移动端页面集成
1. PC端访问页面显示移动端效果
场景：观远页面集成至企业微信、钉钉微应用或者自研小程序后，用户有可能会在PC端访问。只想让用户浏览移动端视图（不允许进入PC端进行编辑）的话，此时提供移动端集成页面时需要注意提供移动端的URL。
移动端的URL格式为：$homeURL/m/page/{pageid}
URL格式示例：https://demo.guandata.com/m/page/p5c0e900bbe3746449bca688
2. 隐藏页面上方页头及底部收藏标志(仪表板入口)
场景：将移动端页面集成至企业微信、钉钉微应用或者自研小程序，只展示页面内容，需要隐藏页头（仪表板入口）把用户限定在页面内不要访问观远其他页面。
参数：?pref.HostNavOnly=true
3. 移动端访问页面显示PC端效果
背景
PC 端页面内嵌于移动端 APP 后，系统默认根据设备属性加载移动布局，以保障手机等窄屏设备的使用体验。但 Pad 等宽屏移动设备因屏幕形态差异，加载移动布局时易出现元素拉伸、内容冗余等问题，导致信息展示效率降低。为此，特推出「基于设备标识的布局自适应」功能，解决宽屏移动端设备的 PC 页面适配需求。
功能介绍
- 核心能力：通过后端配置目标移动端设备的 「浏览器标识」，实现设备与布局的精准匹配。将目标设备的浏览器标识添加至配置项并生效后，该类设备访问内嵌 PC 页面时，直接展示完整 PC 端布局
- 配置逻辑：仅 添加到配置项中的设备标识生效，未配置的移动端设备仍默认打开移动布局。
- 适用设备：主要针对 Pad 等屏幕较宽的移动端设备，也可根据需求扩展至其他需 PC 布局的移动端设备。
操作步骤
-
获取设备的 「浏览器标识」
使用目标设备（如 Pad）打开任意支持 「在线运行 JS 代码」的网站（例如：JS Bin、RunJS）。
在网站的「代码运行区」或「控制台」中，输入以下代码：console.log(window.navigator.userAgent)，执行代码后，页面会输出一串字符串（即设备的浏览器标识），点击「复制结果」将浏览器标识复制并反馈给运维人员。
-
配置设备标识
运维人员接收用户提供的「浏览器标识」，将其填入后端配置文件中。
常见问题
问：浏览器标识是否「每个手机 / 每款型号 / 每个品牌」 唯一？
答：否。浏览器标识与设备的「品牌 - 系列 - 网络环境」强相关，一款设备型号对应一类高度相似的标识。
- 小米、OPPO 的 Pad 设备，标识中通常包含 “Pad” ；
- 三星 Pad 设备，标识中通常包含 “SM-T” ；
- 华为 Mate Pad 设备，标识中通常包含 “TGR_W” 或 “BAH3-W” 。
注意事项
1.问：已有URL里已经包含了 query string 怎么处理？（示例）
答：通过 & 符号来连接所有的参数。举个例子： http://newbi.com?provider=abc&ssotoken=xxxx&key1=ssss
2.问：能否隐藏页面标题栏（使用参数?ps=iframe2 ），但是保留筛选栏呢？
答：默认不支持单独处理，建议把筛选栏上的筛选器都移到页面上。5.4.0及之后的版本可以引入新的配置项，需要同时配置 app_header、page_header_titleBar、page_title 这三个参数，如有疑问可联系观远技术支持。