免费BI 工具FineBI如何以ajex方式单点登录
1 单点登录原理
所谓单点登录通常是指在多系统集成的时候，使用帐号登录一次，即可以登录所有的系统；避免多次登录的麻烦，使多系统集成在前端展示时是无缝的。其实现的方法有两种：一种是同时登录，一种是需要登录时登录；例如将BI集成到OA系统上，同时登录即在登录OA的时候，后台将获取的"username"、'password'传递到BI系统上，BI系统登录验证该"username"、"password"，若验证通过则登录BI系统，此时即一次完成两个系统的登录。另一种方式是在登录完OA系统后，当有进入BI系统的需求时，如要查看BI分析模板，后台判断当需要登录时自动传递当前的'username"、"password'传递给BI系统进行登录验证，验证通过即可查看分析模板。两种方式只是登录BI系统的时间不同而已，都要经过两个步骤，一个是要获取''username'、'password'，一个是要传递到BI系统中进行验证。从原理上看，只要能将获取的''username'、'password'传递到BI上，并登录验证成功，则单点登录就成功了。为保证两个系统的''username'、'password'的同一性，通常使用用户同步数据集的方式来实现。
注：通常用户的系统中会分为明文与密文。在从OA传递'username1'、'password1'到BI与BI从数据集同步过来的''username2'、'password2'进行匹配，当password同为明文或同为密文的时候，在同步数据集的时候无需设置加密方式；若OA传过来的是明文而BI 同步过来的是密文，则需要设置加密方式，使OA传过来
的明文进一次加密后再与BI中的password2匹配。（无论如何设置，一定要保证传递过来的password能通过BI中的password2匹配成功。）
当前BI提供了三种的单点登录设置方式：ajex方式、iframe方式、表单方式；ajex方
式与iframe方式，可进行跨域单点登录即当两个系统不是在同一个服务器上布署时就要进行跨域单点登录。下面分别讲述这三者登录的设置方式。
2 ajex方式单点登录
ajex方式是通过在OA系统登录界面上添加ajex事件来完成传递'username'、'password'到BI进行登录验证。用户在OA系统上输入用户名密码后点击提交或登录按钮时，触发doSubmit()，通过ajax将用户名密码发送到BI系统进行验证，并且在验证成功时，触发html中的表单提交事件，实现BI的登录。由于使用了ajax，需要引入jquery.js，并且因为编码的问题，要对输入的用户名和密码进行cjkEncode编码，需要引入finereport.js，而FR的finereport.js中包含了jquery.js，所以只需要在head标签中引入finereport.js即可，无需再引入jquery.js。其代码如入：
1.<html>
2. <head>
3. <script type="text/javascript" src="ReportServer?op=emb&resource=fi
nereport.js"></script>
4. <script type="text/javascript">
5. function doSubmit() {}
在function doSubmit()后的大括号将实现上述两个步骤“获取用户名及密码”“传递到BI中验证登录”
获取用户名及密码
获取用户名及密码，对输入的用户名和密码进行cjkEncode编码，代码如下：
1.var username = FR.ElementById("username").value);
//获取输入的用户名
2.var password = FR.ElementById("password").value);
//获取输入的参数
其中ElementByld中的"username"、''password"是OA系统登录界面
用户名、密码的文本框中输入值的参数名（实际参数的名称自行在登录界面上查）。
传递用户名及密码并验证登录
添加ajex事件，设置要传递到的服务器的地址，设置跨域方式；使用date函数将获取的username及password赋给BI系统的用户名及密码的参数（BI4.0的用户名及密码的参数是'fr_username''fr_password'）；callback回调函数将参数返回后台并返回判断结果即验证登录，timeout超时时间定为5000ms；返回的结果验证成功：如果BI系统读取的"username"、''password"在后台验证通过，即进行跳转（可跳到index首页，也可直接指定到op=fs平台上）；如果BI系统中未验证成功则显示“fail”；返回的结果未验证成功即"username"、''password"未传递到BI服务器上就显示“error”。其代码如下：
1.jQuery.ajax({
2. url:"localhost:37799/WebReport/ReportServer?op=fs_load&cmd=
sso",//单点登录的报表服务器
3. dataType:"jsonp",//跨域采用jsonp方式
4. data:{"fr_username":username,"fr_password":password},
5. jsonp:"callback",
6. timeout:5000,//超时时间（单位：毫秒）
7. success:function(data) {
jquery实现ajax8.if (data.status === "success") {
9. alert("success"); //登录成功
10.// ElementById("login").submit(); //登录成功提交表单，
跳转到index.jsp这个登录成功页面
11. window.location=data.url;//登录成功，直接跳转到平台系统页面
12. }
13.else if (data.status === "fail"){
14. alert("fail");//登录失败（用户名或密码错误）
15. }
16. },
17. error:function(){
18. alert("error"); // 登录失败（超时或服务器其他错误）
19. }
20. });
注：url为单点登录的BI的服务器的地址，其中“localhost：37799”应换为对应的ip
地址及端口号。
注：由上述的验证可知，如果设置完毕验证失败：“fail”则表示已传递到BI服务器，但是BI上没验证成功，则要检查BI上是否有这个用户，这个用户的密码是否与传递过来的一致或同步的是明文还是密文检查加密方式；若“error”则是没有传递到服务器上，可能是传递的服务器url不正确或者未传递。
设置button触发doSubmit()
doSubmit()函数写完后，在登录页面上设置点击buttom时触发这个函数即可。其代码如下：
1.<input type="button" value="登录" onClick="doSubmit()" />
到此ajex的单点登录方式讲述完毕。其完整代码如下：当然具体实施时要根据实际情况进行相应的设置
1.<html>
2.<head>
3. <meta http-equiv="Content-Type" content="text/html; charset=utf-
8" />
4. <script type="text/javascript" src="localhost:37799/WebRepor
t/ReportServer?op=emb&resource=finereport.js"></script> </script>
5. <script type="text/javascript">
6.
7. function loginFR() {
8. var username =ElementById("username").value;
9. var password =ElementById("password").value;
10. var f = ElementById("loginForm");
11. jQuery.ajax({
12. url:"localhost:37799/WebReport/ReportServer?op=fs_load&cmd=
sso",//单点登录的报表服务器
13. dataType:"jsonp",//跨域采用jsonp方式
14. data:{"fr_username":username,"fr_password":password},
15. jsonp:"callback",
16. timeout:5000,//超时时间（单位：毫秒）
17. success:function(data) {
18.if (data.status === "success") {
19. alert("success"); //登录成功
20.// ElementById("login").submit(); //登录成功提交表单，
跳转到index.jsp这个登录成功页面
21. window.location=data.url;//登录成功，直接跳转到平台系统页面
22. } else if (data.status === "fail"){
23. alert("用户名密码错误！！！"); //登录失败（用户名或密码
错误）
24. }
25. },
26. error:function(){
27. alert("超时或服务器其他错误！！！");// 登录失败（超时或服务器其他错误）
28. }
29.});
30. }
31. </script>
32.<body>
33.<form id="loginForm" name="loginForm" method="post" action="index.html"
>
34.<table>
35.<tbody>
36.<tr class="prop">
37.<td class="name"><label>
38.Username</label></td>
39.<td class="value"><input id="username" type="text" name="username" valu
e="" /></td>
40.</tr>
41.<tr class="prop">
42.<td class="name"><label>
43.Password</label></td>
44.<td class="value"><input id="password" type="password" name="password"
value="" /></td>
45.</tr>
46.</tbody>
47.</table>
48.
49.</div></div></div>
50.<div class="actionButtons">
51. <input id="lalala" type="button" name="lalala" onclick="loginFR();"
value ="登录"/>
52. <input id="sub" type="submit" name="sub" value="" />
53.</div>
54.</form>
55.</body>
56.</html>
注销用户
在单点登录同时登录两个系统后，当注销项目用户时，同时也希望注销报表用户名的session，这时可在点击退出按钮时的同时也可以实现BI退出登录。同单点登录类似，点击退出按钮时触发ajex事件，执行退出命令到BI服务器上，其代码如下：
1.jQuery.ajax({
2. url:"localhost:37799/WebReport/ReportServer?op=fs_load&cmd=
ssout",//单点登录的报表服务器
3. dataType:"jsonp",//跨域采用jsonp方式
4. jsonp:"callback",
5. timeout:5000,//超时时间（单位：毫秒）
6. success:function(data) {
7.if (data.status === "logout") {
8.//登出成功
9. }
10. },
11. error:function(){
12.// 登出失败（超时或服务器其他错误）
13. }
14.});
到此ajex单点登录就讲述完了。
版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。
发表评论