历史版本6 :Web页面简单集成示例 返回文档
编辑时间: 内容长度:图片数:目录数: 修改原因:

目录:

1、描述编辑

FineBI是基于B/S架构的浏览器/服务器模式,现在用户开发的系统基本上趋向于B/S架构的浏览器/服务器模式,因此有些页面完全可以直接采用web页面嵌入式集成的简易方式完成集成。通过集成,用户从自己的系统通过链接使用浏览器访问FineBI的服务器,从而在自己系统内调用BI的web页面,来实际嵌入式集成。

2、实现思路编辑

FineBI在嵌入式集成时一般分为两步:获取token和调用其他相关API。

2.1 获取token

API在调用需要先获取token信息。FineBI通过jsonp获取跨域数据,可以通过登录api先获取token。

登录URL为:/login/cross/domain?fine_username=name&fine_password=password&validity=-1&callback=myfunction

method为:GET

222

2.2 调用其他相关API

获取到token后可以调用其他api。只需要将token放入请求头中:

222

这样便能拿到相应的数据,并进行自定义操作。

注:此处的所有请求都需要带上请求类型:dataType: "jsonp",否则请求无法处理。  

注:因为bi中url上面传的是json对像,有些服务器不支持json 的url,所以需要把json类型的url参数值先进行编码encodeURIComponent()。如:  

222

3、操作步骤编辑

3.1 html文件编写

以获取业务包内表信息的API为例,根据上述的实现思路编写HTML文件,内容如下:

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>业务包内所有表信息</title> </head> <body> <div id="app"></div> </body> <script src="http://code.jquery.com/jquery-2.1.1.min.js"></script> <script> var url = "http://demo.finebi.com/webroot/decision"; var userName = "demo", password = "demo"; function getPackTables(data) { var header = {}; header.Authorization = "Bearer " + data.accessToken; // 请求头中带上token $.ajax({ type: "GET", url: url + "/v5/api/conf/packs/dac1c0f5b11f46fcb9eb03280a4c26c5", headers: header, dataType: "jsonp", success: function (result) { var htm = "", data = result.data; htm += "<div>当前业务包名:" + data.name + "</div>"; htm += "<div>该业务包下有如下表:</div>"; htm += "<ul>"; data.tables.forEach(function (table) { htm += "<li>原始名:" + table.name + ", 转义名为:" +table.transferName + "</li>"; }); htm += "</ul>"; var app = document.getElementById("app"); app.innerHTML = htm; } }); } //先通过登录接口获取到token信息 $.ajax({ type: "GET", url: url + "/login/cross/domain?fine_username=" + userName + "&fine_password=" + password + "&validity=-1", dataType: "jsonp", success: function (data) { getPackTables(data); } }); </script> </html> 

注:以上文件中写的URL地址为FineBI的demo地址demo.finebi.com,可根据需要修改为自身工程的地址及端口。  

3.2 启动BI服务器

启动上述地址中书写的对应FineBI服务器。

3.3 效果查看

输入文件的访问地址,比如http://demo.finebi.com/webroot/getPackTables.html,可以看到该html文件获取的业务包内表信息数据,如下图:

222

4、注意事项编辑

由于平台安全限制,FineBI在集成时需要将管理系统>安全管理>安全防护中的Security Headers关闭才可跨域,如下图:

222