jquery ajax跨域的完美解决方法(jsonp方式)

时间:2022-09-12 14:42:23
ajax跨域请求的问题,JQuery对于Ajax的跨域请求有两类解决方案,不过都是只支持get方式,接下来为大家详细介绍下客户端JQuery.ajax的调用代码
 
 
今天在项目中需要做远程数据加载并渲染页面,直到开发阶段才意识到ajax跨域请求的问题,隐约记得Jquery有提过一个ajax跨域请求的解决方式,于是即刻翻出Jquery的API出来研究,发
JQuery对于Ajax的跨域请求有两类解决方案,不过都是只支持get方式。分别是JQuery的 jquery.ajax
jsonp格式和jquery.getScript方式。

什么是jsonp格式呢?API原文:如果获取的数据文件存放在远程服务器上(域名不同,也就是跨域获取数据),则需要使用jsonp类型。使用这种类型的话,会创建一个查询字符串参数
callback=?
,这个参数会加在请求的URL后面。服务器端应当在JSON数据前加上回调函数名,以便完成一个有效的JSONP请求。意思就是远程服务端需要对返回的数据做下处理,根据客户端提交的callback的参数,返回一个callback(json)的数据,而客户端将会用script的方式处理返回数据,来对json数据做处理。JQuery.getJSON也同样支持jsonp的数据方式调用。

1 $.ajax({
                     url:basepath+"/login/login?msg_base64="+msg_base64,
async: false,
// data:{
// "formContent":str,
// "formName":formName,
// "leixing":leixing
// },
dataType:"jsonp",
processData: false,
type:"get",
success:function(data){
data=data[0];
alert(data);
if(data.status=="0"){
$("#usererror").html(data.msg);
}else if(data.status=="1"){
$("#pwderror").html(data.msg);
}
else if(data.status=="2"){
alert("水电费:"+data.data);
addCookie("token",data.data,1);//将令牌存入cookie中
window.location.href="edit.html";
}
}
});
 @ResponseBody // 将方法的返回结果自动转换为json格式字符串,注意需要导json的包
@RequestMapping(value = "/login", method = RequestMethod.GET)
public String login(HttpServletRequest request,String msg_base64) { String callback=request.getParameter("callback");
//System.out.println(callback);
// 信息
// String msg_context_base64 = msg_base64.split(" ")[1];
String msg = NoteUtil.base64Decode(msg_base64);// 解密,解密后:username:password
String name = msg.split(":")[0];
String pwd = msg.split(":")[1];
NoteResult result = service.checkUser(name, pwd);
System.out.println("result "+result.toString());
JSONArray json=JSONArray.fromObject(result);
System.out.println(" "+callback+"("+json+")");
return callback+"("+json.toString()+")";
}
19

jquery ajax跨域的完美解决方法(jsonp方式)的更多相关文章

  1. jQuery ajax跨域请求的解决方法

    在Ajax应用中,jQuery的Ajax请求是非常容易而且方便的,但是初学者经常会犯一个错误,那就是Ajax请求的url不是本地或者同一个服务器下面的URI,最后导致虽然请求200,但是不会返回任何数 ...

  2. Jquery DataTable AJAX跨域请求的解决方法及SSM框架下服务器端返回JSON格式数据的解决方法

    如题,用HBuilder开发APP,涉及到用AJAX跨域请求后台数据,刚接触,费了不少时间.幸得高手指点,得以解决. APP需要用TABLE来显示数据,因此采用了JQ 的DataTable.  在实现 ...

  3. JQuery的Ajax跨域请求的解决方式

            今天在项目中须要做远程数据载入并渲染页面,直到开发阶段才意识到ajax跨域请求的问题,隐约记得Jquery有提过一个ajax跨域请求的解决方式,于是即刻翻出Jquery的API出来研究 ...

  4. JQuery.Ajax + 跨域 (crossDomain) + POST + JSON + WCF RESTful, 5大陷阱和解决方案

    JQuery.Ajax + 跨域 (crossDomain) + POST + JSON + WCF RESTful, 5大陷阱和解决方案 最近在开发WSS RESTful服务的时候, 碰到了这些个纠 ...

  5. Ajax跨域请求怎么解决?

    前言 项目中需要将第三方系统中,对应用户的代办消息集成到系统中.对方提供了获取对应用户的接口url,但是由于两边的系统是部署到客户现场不同IP的虚机上的,所以进行ajax请求的时候是属于跨域请求的.之 ...

  6. NodeJ node.js Jquery Ajax 跨域请求

    Jquery + Ajax 跨域请求 说白了就是前台请求ajax数据(JSON)但是请求的数据不在本地的绝对路径下,接口数据 是没有这个安全性的我对外公开的接口数据,只要你找到接口你就可以使用里面的数 ...

  7. 关于JQuery Ajax 跨域 访问.net WebService

    关于这个 jQuery Ajax跨域访问 WebService 前天整了好几个小时没整明白 今天再看一下 结果突然就顿悟了 1.建一个空webApplication --添加--新建项--web服务( ...

  8. jquery Ajax跨域调用WebServices方法

    由于公司需要开发一个手机页面,想提供给同事直接在手机上可以查询SAP资料.数据需要使用js调用webserver来获取. 因为初次使用Jquery调用Webserver,所以期间并不顺利.测试调用We ...

  9. ajax本地跨域请求以及解决方法

    什么是跨域?   我们通常所说的跨域是狭义的,是由浏览器同源策略限制的一类请求场景.所谓同源是指"协议+域名+端口"三者相同,即便两个不同的域名指向同一个ip地址,也非同源,只要没 ...

随机推荐

  1. springmvc 学习笔记_1

    一.回顾JavaWeb中的MVC设计模式 1)MVC这种设计模式,不光运用于Web领域,而且也能用于非Web领域 2)今天说的MVC特指一种表现层设计模式,不限于Java语言 二.回顾struts2+ ...

  2. Oracle使用小记

    windows下Oracle必须要启动的服务 Oracle ORCL VSS Writer Service:Oracle卷映射拷贝写入服务,VSS(Volume Shadow Copy Service ...

  3. 1.9 基础知识——GP2.10 高级别的领导检查(Higher level management)

    GP2.10 Review the activities,status,and results of XXX process with highter level management and res ...

  4. Area(Pick定理POJ1256)

    Area Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 5429   Accepted: 2436 Description ...

  5. Spring中自动装配(转)

    Spring中有四种自动装配类型,分别为:byName,byType,constructor,autodetect,下面来分别介绍一下这些是如何自动装配的 <bean id="foo& ...

  6. 浅析dex文件加载机制

    我们可以利用DexClassLoader来实现动态加载dex文件,而很多资料也只是对于DexClassLoader的使用进行了介绍,没有深入讲解dex的动态加载机制,我们就借助于Android4.4的 ...

  7. C&num; &num;if DEBUG

    首先,大小写不能写错,其次,解决方案配置设为:Debug,才会执行该语句,如果在条件里面搭配Debug.Assert等,效果甚佳.而如果要设置为Release模式,就不会执行条件语句中的内容,有时候可 ...

  8. BZOJ&period;2616&period;SPOJ PERIODNI&lpar;笛卡尔树 树形DP&rpar;

    BZOJ SPOJ 直观的想法是构建笛卡尔树(每次取最小值位置划分到两边),在树上DP,这样两个儿子的子树是互不影响的. 令\(f[i][j]\)表示第\(i\)个节点,放了\(j\)个车的方案数. ...

  9. python &lowbar;&lowbar;setattr&lowbar;&lowbar;、&lowbar;&lowbar;getattr&lowbar;&lowbar;、&lowbar;&lowbar;getattribute&lowbar;&lowbar;全面详解

    一.属性引用函数 hasattr(obj,name[,default])getattr(obj,name)setattr(obj,name,value)delattr(obj,name) 二.属性引用 ...

  10. 【RabbitMQ】3、win7下安装RabbitMQ

    RabbitMQ依赖erlang,所以先安装erlang,然后再安装RabbitMQ; erlang,下载地址:http://www.erlang.org/download RabbitMQ,下载地址 ...