sso单点登录 ajax请求,ajax跨域异步单点登录

通过简化的OA登录页面说明ajax的实现步骤。

3.1 ajax实现步骤(1)登陆按钮事件设置

用户输入用户名密码后点击提交或登录按钮时,触发doSubmit()方法,该方法中实现登录事件并且通过ajax将用户名密码发送到报表系统进行验证,并且在验证成功时,触发html中的表单提交事件,实现登录成功页面的跳转,实现报表认证代码如下:

function doSubmit() {

var username =document.getElementById("username").value;

var password =document.getElementById("password").value;

jQuery.ajax({

url:"http://localhost:8075/WebReport/ReportServer?op=fs_load&cmd=sso",//单点登录的报表服务器

dataType:"jsonp",//跨域采用jsonp方式

data:{"fr_username":username,"fr_password":password},

jsonp:"callback",

timeout:5000,//超时时间(单位:毫秒)

success:function(data) {

if (data.status === "success") {

alert("success"); //登录成功

// document.getElementById("login").submit(); //登录成功提交表单,跳转到index.jsp这个登录成功页面

window.location=data.url;//登录成功,直接跳转到平台系统页面

}

else if (data.status === "fail"){

alert("fail");//登录失败(用户名或密码错误)

}

},

error:function(){

alert("error"); // 登录失败(超时或服务器其他错误)

}

});

}

注:由于使用了ajax,需要引入jquery.js,并且因为编码的问题,要对输入的用户名和密码进行cjkEncode编码,需要引入finereport.js,而FR的finereport.js中包含了jquery.js,所以只需要在head标签中引入finereport.js即可,无需再引入jquery.js,如下:

另:如果在win8下单点登录异常,在ajax传递用户名密码的时候转码一下即可,比如说fr_password":encodeURIComponent(password)。

FR.cjkEncode(document.getElementById("username").value);    //使用FR的内置编码函数进行编码转化

也可以自己写cjkEncode函数,实现方法见cjk编码转换文档。

另:如果登录页面所在工程不是FineReport的工程,则无法引入finereport.js,所以只能手动引入jquery.js,如果需要编码,再自定义cjkEncode函数,示例中就是直接引入jquery.js,且没有进行编码转换。

3.2 完整代码

将上述ajax单点登录的提交事件放到原来OA系统登录页面中,是指点击登录按钮时,触发该事件,修改后即可以实现跨域单点异步登录的代码如下:

function doSubmit() {

var username = FR.cjkEncode(document.getElementById("username").value); //获取输入的用户名

var password = FR.cjkEncode(document.getElementById("password").value); //获取输入的参数

jQuery.ajax({

url:"http://localhost:8075/WebReport/ReportServer?op=fs_load&cmd=sso",//单点登录的管理平台报表服务器

dataType:"jsonp",//跨域采用jsonp方式

data:{"fr_username":username,"fr_password":password},//获取用户名密码

jsonp:"callback",

timeout:5000,//超时时间(单位:毫秒)

success:function(data) {

if (data.status === "success") {

window.location=data.url;//认证成功跳转页面,因为ajax不支持重定向所有需要跳转的设置

//登录成功

} else if (data.status === "fail"){

alert("用户名或密码错误");//登录失败(用户名或密码错误)

}

},

error:function(){

alert("超时或服务器其他错误");// 登录失败(超时或服务器其他错误)

}

});

}

请登录

用户名:

密 码:

注:用户名密码表单中使用button来触发doSubmit(),您只要将doSubmit()方法加入到您的OA的登录页面中即可,为了简化操作,上面的完整代码没有跳转到指定页面,而是跳转到op=fs页面。

另:Android WebView 中进行ajax跨域请求需要额外设置 webView.getSettings().setAllowUniversalAccessFromFileURLs(true);

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN){

webView.getSettings().setAllowUniversalAccessFromFileURLs(true);

}else{

try {

Class> clazz = webView.getSettings().getClass();

Method method = clazz.getMethod("setAllowUniversalAccessFromFileURLs", boolean.class);

if (method != null) {

method.invoke(webView.getSettings(), true);

}

} catch (NoSuchMethodException e) {

e.printStackTrace();

} catch (InvocationTargetException e) {

e.printStackTrace();

} catch (IllegalAccessException e) {

e.printStackTrace();

}

}

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值