1. 概述
1.1 版本
| 网页框控件插件 | App | HTML5 移动端展现插件 | 新增功能 |
|---|---|---|---|
| - | 10.4.61 | 10.4.61 | - |
| - | 10.4.90 | 10.4.90 | 移动端预览时，网页框根据内嵌的模板自适应高度 |
| - | 10.4.977 | 10.4.977 | 移动端预览时，打开［网页框］模板中的子模板，App与 H5 一致，都是从新窗口打开 |
1.2 问题描述
决策报表中，没有提供网页框控件。这使得在嵌入引用其他网页或者报表的时候，很不方便。
1.3 解决方案
为了解决在决策报表中引用其他 Web 链接的问题，用户可以使用「网页框控件插件」。
注：网页框控件插件不支持流媒体。
网页框内容不支持导出。
2. 插件介绍
2.1 安装插件
点击下载插件： 网页框控件插件
设计器插件安装方法请参见：设计器插件管理
服务器安装插件方法请参见：服务器插件管理
2.2 添加网页框控件
插件安装完毕后，新建决策报表，点击「控件栏」，新增了「网页框控件」，拖动到决策报表 body 界面，即可添加。如下图所示：
2.3 地址和参数
选中「网页框控件」，可以设置「地址和参数」，步骤如下图所示：
2.3.1 地址
支持添加两种类型的链接。
1）模板路径
注：不支持模板路径和名称里面存在 & 符号。
「模板路径」为相对路径，点击「···」，出现模板选择，选中需要的模板即可，如下图所示：
2）网络路径
「网络路径」为绝对路径。「网络路径」的应用场景及方法如下表所示：
注：网络路径公式状态下，直接输入链接即可，链接前不能有「=」。
| 应用场景 | 备注 |
|---|---|
| 预览模板 | 输入模板预览链接 http://IP:端口号/工程名，如下所示：http://localhost:8075/webroot/decision/view/report?viewlet=GettingStarted.cpt |
| 预览视频 | 方法一： 输入完整视频网页 URL ，如下所示： https://www.iqiyi.com/v_19rxqx1kww.html?vfrm=pcw_home&vfrmblk=B&vfrmrst=fcs_0_p11 方法二： 将下载后的视频保存在%FR_HOME%\webapps\webroot，输入链接http://IP:端口号/工程名/视频名称，如下所示： http://localhost:8075/webroot/6.gif |
| 预览自定义 HTML 页面 | 将自定义的 HTML 页面保存在%FR_HOME%\webapps\webroot，输入链接http://IP:端口号/工程名/HTML页面名称，如下所示：http://localhost:8075/webroot/1.html |
2.3.2 参数
示例：
1）「网络路径」下若添加了参数及默认值，链接使用 模板预览 链接，示例链接为：http://localhost:8075/webroot/decision/view/report?viewlet=doc%252Fphone%252F%25E5%258A%25A8%25E6%2580%2581%25E5%2588%2586%25E7%25BB%2584.cpt如下图所示：
效果如下图所示：
2）若参数拼接在模板链接 URL 尾部，「网络路径」示例链接为：http://localhost:8075/webroot/decision/view/report?viewlet=doc/phone/动态分组.cpt&销售员=孙林&产品类型=饮料&产品=牛奶
如下图所示：
效果如下图所示：
注1：同模板多个「网页框」配置同一个链接，会相互影响（不同参数视为不同链接）。
注2：网页框里挂载 BI 模板链接时，参数需要拼接到链接后 。
2.4 滚动条
「网页框」的宽高就是所在单元格的宽和高，当嵌入的网页的宽或高超过网页框的宽高值时，就会出现相应的「水平滚动条」与「垂直滚动条」。
属性设置中，「水平滚动条可见」与「垂直滚动条可见」默认勾选。
若取消勾选，预览模板时，不可见滚动条且无法滚动，超出「网页框」大小的内容会被截断不显示。
2.5 组件大小
当 body 布局方式设置为「绝对布局」时，可自定义组件大小。如下图所示：
2.6 支持自适应高度
移动端自适应规则如下表所示：
| 所在模板类型 | 所在模板布局 | 内嵌模板类型 | 内嵌模板布局 |
|---|---|---|---|
| frm 模板 | 移动端手机重布局（body 内/ Tab 内） | FR 模板 | cpt 模板不自适应 |
| cpt 模板横向自适应 | |||
| frm 模板 body 的移动端 Tab 页下勾选 手机重布局 | |||
| frm 模板 body 的移动端 Tab 页下不勾选 手机重布局 ，且 组件缩放 选择横向自适应 | |||
| 不勾选 手机重布局，且缩放逻辑为固定大小 |
需注意以下几点：
「网页框控件」自适应时，冻结不生效。
「网页框」内配置跨域的链接，「网页框」自适应不生效 。
Android App 上，模板 A 的「网页框控件」中内嵌模板 B ，外部手势（滑动模板 A ）与内部手势（滑动模板 B ），每次只能响应一个，另一个禁用。
移动端预览时，打开［网页框］模板中的子模板时：如果子模板设置的当前窗口，则从网页框内部打开；如果子模板设置的新窗口，则从新窗口打开。
3. JavaScript 接口
决策报表里有一个网页框控件 「rHIframe0」，用户可新增「按钮控件」，添加不同的「点击事件」，以达到不同的效果。如下图所示：
3.1 setValue(String)
设置并刷新「网页框控件」的地址(保留原参数)
3.1.1 模板路径
var Widget = _g().getWidgetByName('rHIframe0');
Widget.setValue("${servletURL}?viewlet=GettingStarted.cpt");3.1.2 网络路径
var Widget = _g().getWidgetByName('rHIframe0');
Widget.setValue("http://localhost:8075/webroot/decision/view/report?viewlet=GettingStarted.cpt");
3.2 reload()
重新刷新网页框：
var Widget = _g().getWidgetByName('rHIframe0');
Widget.reload();3.3 loadUrl(String)
加载指定的 URL 链接地址。
3.3.1 模板路径
var Widget = _g().getWidgetByName('rHIframe0');
Widget.loadUrl("${servletURL}?viewlet=GettingStarted.cpt");3.3.2 网络路径
var Widget = _g().getWidgetByName('rHIframe0');
Widget.loadUrl("http://localhost:8075/webroot/decision/view/report?viewlet=GettingStarted.cpt");4. 移动端
App 和 H5 插件版本在 10.4.61 及之后时，「网页框控件插件」支持在移动端使用。
注1：移动端不支持 JavaScript 接口。
注2：通过「网页框控件插件」预览模板时，移动端不支持显示模板中的参数面板。
5. 注意事项
5.1 内嵌 BI 模板报错
当「网页框控件」内嵌 BI 模板，点击预览时，出现如下报错：
打开 FineBI 服务器，用管理员账号登录，点击管理系统>安全管理>安全防护，关闭 Security Headers 即可。
注：Security Headers 默认开启。