报表如何嵌入到网页并接收参数？
需求：客户在自己的BS业务系统或者项目中，需要在增加报表功能。需要将Wyn Enterprise开发好的报表，嵌入到Web报表页面并接收外部的参数值。
本文以html页面嵌入为例，介绍如何嵌入报表并传递参数。
实现效果：
实现步骤：
一、使用Wyn Enterprise设计含参的报表；
含参报表的设计方法请参考帮助文档：https://help.grapecity.com.cn/pages/viewpage.action?pageId=38473696
本教程示例以销售明细数据为例，报表参数为：
二、获取报表的URL
设计完报表并保存之后，预览报表。点击又上角新窗口预览。以获取当前包的URL。
例如：http://localhost:51980/reports/view/5ddb6711b1b8f5006be00745?display=singlepage¶mpanel=top&dp=%7B%22p1%22%3A%5B%22%22%5D%7D&theme=default&lng=zh-CN
三、获取Token
登录Wyn系统管理，在账户管理中，使用固定用户生成令牌。
四、在html中使用Iframe嵌入
1.拼接含有参数和token的完整URL。
Wyn Enterprise的报表和仪表板URL参数说明，请参考：https://help.grapecity.com.cn/pages/viewpage.action?pageId=42075479
&dp参数用于设置仪表板或报表中数据过滤的参数值。当仪表板或报表中设置了参数时，进行URL系统集成时则需要在URL中设置参数的值。
完整URL包含3部分：报表/仪表板URL+ 参数 + token；
本例完整URL示例：
urlStr="http://localhost:51980/reports/view/5ddb6711b1b8f5006be00745?display=singlepage¶mpanel=top&dp=%7B%22p1%22%3A%5B%22" + val +"%22%5D%7D" + "&token=198675ae42401099a5996e81b87c27e8a3e8658320ee7d5e768116eb3b6fb66b"
val为外部传递的参数值。
2.编辑html页面代码。
<html>
<head>
</head>
<body>
<p>各地区销售报表</p>
<div style="
<input id="input1" type="textbox" >
<input id="output" type="textbox" >
<input id="input2" type="button" value="查询"/>
</div>
<br/>
<br/>
<script>
function test(){
var val=document.getElementById("input1").value;
var urlStr="http://localhost:51980/reports/view/5ddb6711b1b8f5006be00745?display=singlepage¶mpanel=top&dp=%7B%22p1%22%3A%5B%22" + val +"%22%5D%7D" + "&token=198675ae42401099a5996e81b87c27e8a3e8658320ee7d5e768116eb3b6fb66b";
document.getElementById("output").value=urlStr;
var iframe=document.createElement("iframe");
iframe.src=urlStr;
iframe.style="height:100%;width:100%;"
document.body.appendChild(iframe);
}
</script>
</body>
</html>
预览html测试效果：
点击查询的时候，将文本框1的值传递给url，报表按照dp参数值进行数据过滤查询。
