jQuery JSONP 跨域实践
一客户端(url:http://192.168.1.2:81/jsonp_test.jsp
)
客户端页面首先在body 中放置一个div: <div id="res"></div> 将远程调用的数据写入该div中
<script type="text/javascript" src="/js/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$.ajax({
url:'http://192.168.9.5/jsonp_test1.jsp',
dataType:"jsonp",
jsonp:"jsonpcallback",
success:function(data){
var $ul = $("<ul></ul>");
$.each(data,function(i,v){
$("<li/>").text(v["id"] + " " + v["name"]).appendTo($ul)
});
$("#res").append($ul);
}
});
});
</script>
服务端(url:
http://192.168.9.5/jsonp_test1.jsp
)
代码很简单,就是输出一个字符串
比如正常输出json应该是:[{"id":"1","name":"测试1"},{"id":"2","name":"测试2"}]
jsonp 则输出: jsonpcallback([{"id":"1","name":"测试1"},{"id":"2","name":"测试2"}]) 其中“jsonpcallback”是客户端传过来的
jsonp = request.getParameter("jsonpcallback")
str = "[{""id"":""1"",""name"":""测试1""},{""id"":""2"",""name"":""测试2""}]"
str = jsonp + "(" +str+")"
response.Write(str)
由于 jquery 在ajax 处理中使用的是utf-8编码传递参数的,所以jsonp处理端用utf-8的编码最好,这样省得编码转换了
最终效果截图:
分享到:
相关推荐
NULL 博文链接:https://sagewsg.iteye.com/blog/1670992
JSONP实现跨域 常用的jquery实现跨域调用 $.ajax({ url: "http://127.0.0.1/~chenjiebin/mycode/php/crossdomain/index.php", dataType: "jsonp", jsonp: "callback", context: document.body, success: ...
1、地址http://a.test.com:8888/testAjaxCross/public/index.do 演示跨域问题以及跨子域名解决方法 2、地址...演示jsonp解决跨域问题的三种方案jsonp、$getJSON、$ajax等
php if (isset($_GET[‘jsonpcallback’])){ echo $_GET[‘jsonpcallback’].”([{id:1,name:’aaaa1′},{id:2,name:’bbbb2′}])”; exit; } ?> <html> [removed][removed] [removed] $(function(){ $....
NULL 博文链接:https://onestopweb.iteye.com/blog/2326155
NULL 博文链接:https://czj4451.iteye.com/blog/1992352
NULL 博文链接:https://8366.iteye.com/blog/744057
NULL 博文链接:https://bijian1013.iteye.com/blog/2179338
为什么会有跨域问题? – 因为有同源策略 同源策略是浏览器的一种安全策略,所谓同源指的是 请求URL地址中的 协议, 域名 和 端口 都相同,只要其中之一不相同就是跨域 同源策略主要为了保证浏览器的安全性 在同源...
本文实例讲述了jQuery使用JSONP实现跨域获取数据的三种方法。分享给大家供大家参考,具体如下: 第一种方法是在ajax函数中设置dataType为’jsonp’ $.ajax({ dataType: 'jsonp', url: '...
利用JQuery jsonp实现Ajax跨域请求 .Net 的*.handler 和 WebService,返回json数据
代码如下: $.ajax({ async:false, url: ”, // ...原因可能是dataType如果指定为jsonp的话,就已经不是ajax事件了 }, success: function (json) { //客户端jquery预先定义好的callback函数,成功获取跨域服务器上的j
SignalR 分:PersistentConnection和Hub 2种模式。跨域又分:UseCors和JsonP 2种方法 所以例子写了4种。介绍:http://www.cnblogs.com/shikyoh/p/6272679.html
//jsonp接口//http://history.sturgeon.mopaas.com/jsonp //json接口//http://history.sturgeon.mopaas.com/jsonp/1@1 //历史上的1月1日//http://history.sturgeon.mopaas.com/1@1 //历史上的1月
NULL 博文链接:https://yin-bp.iteye.com/blog/1528721
NULL 博文链接:https://lc87624.iteye.com/blog/1123148
jquery下利用jsonp跨域访问实现方法.docx
本程序较大,每个知识点都有注释,适用于学习使用,其中主要功能包括:文件格式转换(doc转pdf、ppt转pdf、pdf转txt、pdf转pic,包括免安装Office常见第三方库实现和使用Office自己的COM实现),文件上传服务器,...