如何用jQuery+JSONP实现跨域请求
导读：本文共1564.5字符，通常情况下阅读需要5分钟。同时您也可以点击右侧朗读，来听本文内容。按键盘←（左） →（右） 方向键可以翻页。
摘要： 问题：本地现有一个页面demo.html需要从http://localhost:3561/User/GetAllNames获取数据并展示。 解答：由于问题中的两方不在同一服务器，故需要使用jsonp来跨域访问。 ① 客户端编写 客户端使用jQuery中提供的$.getJson方法来跨域访问。getJson有3个参数： I. url：请求地址； ... ...
目录
(为您整理了一些要点),点击可以直达。问题：本地现有一个页面demo.html需要从http://localhost:3561/User/GetAllNames获取数据并展示。
解答：由于问题中的两方不在同一服务器，故需要使用jsonp来跨域访问。
① 客户端编写
客户端使用jQuery中提供的$.getJson方法来跨域访问。getJson有3个参数：
I. url：请求地址；
II. data：发送到服务端的参数；
III. callback：成功时的回调函数。
getJson的使用方法和普通的$.get方法基本一致，不同的地方在于getJson需要在url后面的参数部分加上callback=?这一固定部分，jQuery 将自动替换 ? 为正确的函数名，以执行回调函数。然后在回调函数中操作从异域返回的json对象，回调函数callback的参数即为该json对象。
<!DOCTYPEhtml><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/><title></title></head><body><ulid="nameList"></ul><scriptsrc="http://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script><scripttype="text/javascript">$.getJSON("http://localhost:3561/User/GetAllNames?callback=?",function(json){for(vari=0;i<json.length;i++){$("#nameList").append("<li>"+json[i]+"</li>");}});</script></body></html>② 服务端编写
服务端的逻辑主要是将数据序列化为json字符串，然后封装成"callback(json)"的形式，callback为jQuery自动生成并传到服务端的函数名称。下面使用C#实现：
publicclassUserController:Controller{publicstringGetAllNames(stringcallback){string[]names=newstring[]{"张三丰","张无忌","令狐冲","杨过","郭靖"};JavaScriptSerializerjss=newJavaScriptSerializer();stringjson=jss.Serialize(names);returnstring.Format("{0}({1})",callback,json);}}至此，便成功解决了问题。
思考：如果服务端已经写死了callback（如：return string.Format("moty({0})", json);）,那么客户端该怎么写呢？
参考：
$.ajax("http://localhost:3561/User/GetAllNames",{jsonpCallback:"moty",dataType:"jsonp",success:function(json){for(vari=0;i<json.length;i++){$("#nameList").append("<li>"+json[i]+"</li>");}}}); </div> <div class="zixun-tj-product adv-bottom"></div> </div> </div> <div class="prve-next-news">如何用jQuery+JSONP实现跨域请求的详细内容，希望对您有所帮助，信息来源于网络。