反饋已提交
網絡繁忙
OA 系统与报表系统集成,将报表绑定在 OA 系统的节点上,对于 OA 系统中想实现对 FineReport 的单点登录,用户需要在 OA 的登录界面中将用户名和密码传入到报表的认证地址进行认证。
若 OA 系统和报表系统不是部署在同一台服务器上,在登录时进行跨域,那么要如何通过 Ajax 实现 OA 系统和报表系统的跨域登录呢?
iframe 方式和 Ajax 方式两种登录方式均可实现单点登录的跨域,但 Ajax 可以实现异步的单点登录,并且可对报表系统验证的结果进行处理,如登录超时;但是 iframe 不可以异步处理,并且在进行报表验证的时候,无法对验证的结果进行处理。
Ajax 登录方式天然支持跨域,故在 OA 系统的登录界面中直接通过 Ajax 将用户名密码发送到报表服务器进行后台验证,则可解决跨域单点登录问题。
注:决策平台单点登录接口介绍请参见:决策平台单点登录接口
启动两个工程,端口号分别为 8075 和 8080,将新建 HTML 文件 ajaxlogin.html、ajaxlogout.html 放到端口号为 8075 的工程下。访问http://localhost:8075/webroot/ajaxlogin.html,输入 8080 工程的用户名和密码,成功访问 8080 工程。
在登录成功的浏览器上新开标签页,访问http://localhost:8075/webroot/ajaxlogout.html,点击「登出」按钮,刷新之前登录成功的 8080 工程页面,用户被踢出登录。
注:本章示例适用于 PC 端。
1)本文示例准备的两个工程分别为:
本地工程,端口号为 8075
部署到 Tomcat 上的工程,端口号为 8080
Tomcat 服务器部署请参见:独立部署
2)启动两个工程。
新建 HTML 文件,命名为「ajaxlogin.html」,代码如下所示:
注1:根据实际情况修改代码中的访问路径或端口号。
注2:内网环境中,下面代码引用的 jquery.min.js 文件无法生效,需下载 JS 文件到本地并修改对应的路径,具体步骤请参见:单点登录问题汇总 文档中的 2.4 节内容。
<!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content="text/html; " charset="UTF-8"> <script type="text/javascript" src="https://cdn.bootcss.com/jquery/1.9.1/jquery.min.js"></script> <script type="text/javascript"> function doSubmit() { var username = document.getElementById("username").value.trim(); var password = document.getElementById("password").value.trim(); if (username === "") { window.alert("请输入用户名"); return false; } if (password === "") { window.alert("请输入密码"); return false; } var url = "http://localhost:8080/webroot/decision/login/cross/domain" + "?fine_username=" + username + "&fine_password=" + password + "&validity=" + -1; alert(url); jQuery.ajax({ url: url,//单点登录的管理平台报表服务器 timeout: 5000,//超时时间(单位:毫秒) dataType:"jsonp",//跨域采用jsonp方式 jsonp:"callback", success: function (res) { console.log(res); if (res.errorCode) { window.alert(res.errorMsg); }else { // 保存token并跳转到对应链接 window.location.href = "http://localhost:8080/webroot/decision"; } }, error: function () { alert("超时或服务器其他错误");// 登录失败(超时或服务器其他错误) } }); } </script></head><body><p>请登录</p><form id="login" name="login" method="POST" action=""> <p>用户名:<input id="username" type="text" name="username"/></p> <p>密 码:<input id="password" type="password" name="password"/></p> <input type="button" value="登录" onClick="doSubmit()"/></form></body></html>
代码说明:
用户输入用户名密码后点击提交或登录按钮时,触发「doSubmit()」方法,该方法中实现登录事件并且通过 Ajax 将用户名密码发送到报表系统进行验证,并且在验证成功时,触发 HTML 中的表单提交事件,实现登录成功页面的跳转。
用户名密码表单中使用 button 来触发 doSubmit(),您只要将 doSubmit() 方法加入到您的 OA 的登录页面中即可,为了简化操作,上面的完整代码没有跳转到指定页面,而是跳转到平台页面。
注1:由于使用了 Ajax,需要引入 jquery.js。
注2:如果在 Win8 下单点登录异常,在 Ajax 传递用户名密码的时候转码一下即可,比如说 fine_password":encodeURIComponent(password)。
新建 HTML 文件,命名为「ajaxlogout.html」,代码如下所示:
注:根据实际情况修改代码中的访问路径或端口号。
<html> <head> <meta http-equiv="Content-Type" content="text/html; " charset="UTF-8"> <script type="text/javascript" src="https://cdn.bootcss.com/jquery/1.9.1/jquery.min.js"></script> <script type="text/javascript"> function doSubmit() { jQuery.ajax({ url:"http://localhost:8080/webroot/decision/logout/cross/domain",//单点登录的报表服务器 dataType:"jsonp",//跨域采用jsonp方式 jsonp:"callback", timeout:5000,//超时时间(单位:毫秒) success:function(data) { if (data.status === "success") { //登出成功 alert("已登出"); } }, error:function(){ // 登出失败(超时或服务器其他错误) } }); } </script> </head> <body> <p>请登出</p> <form id="login" name="login" method="POST" action="" > <input type="button" value="登出" onClick="doSubmit()" /> </form> </body> </html>
将保存后的 ajaxlogin.html、ajaxlogout.html 文件放到端口号为 8075 工程的%FR_HOME%/webapps/webroot文件夹下,如下图所示:
1)以管理员身份进入端口号为 8075 工程的平台,点击「管理系统>安全管理」,关闭「内容嗅探攻击防护」、「点击劫持攻击防护」,如下图所示:
2)相同步骤关闭端口号为 8080 工程的「内容嗅探攻击防护」、「点击劫持攻击防护」。
1)打开浏览器,访问:http://localhost:8075/webroot/ajaxlogin.html,输入端口号为 8080 工程的账号和密码,成功访问 8080 工程。如下图所示:
2)在登录成功的浏览器上新开标签页,访问http://localhost:8075/webroot/ajaxlogout.html,点击「登出」按钮,切换到之前登录成功的 8080 工程页面,刷新该页面,用户被踢出登录。如下图所示:
注:如果端口号为 8075 和端口号为 8080 的两个工程都开启 短信登录验证 ,访问http://localhost:8075/webroot/ajaxlogin.html时,ajax 单点登录会跳过短信验证直接登录成功。
报表通过 URL 传用户名和密码进行验证,传到报表服务器是以 Session 的方式保存,防止被人中途拦截会导致系统泄密,可以对登录进来的密码进行加密,可参考文档 密码加密设置
用户也可以使用 https 证书,让请求在传输过程中加密,配置方法也很简单,修改下服务器的配置文件就可以。这种方式如果使用自己生成的证书,客户端在访问报表中浏览器会显示证书非法警告,所以需要去购买合法证书。
文 檔回 饋
滑鼠選中內容,快速回饋問題
滑鼠選中存在疑惑的內容,即可快速回饋問題,我們將會跟進處理。
不再提示
10s後關閉