浏览器的同源策略,限制脚本程序只能和同协议,同域名,同端口的脚本进行交互,包括共享和传递变量,cookie的传递。尽管浏览器不允许页面脚本跨域读取数据,但是允许html引用跨域的资源,比如脚本程序,css,图片,等等,因为script,iframe的src是不存在跨域的。
$.get("http://www.hualai.net.cn/news/website.jsp",
{}, function(data){
alert(' error:'+data)
}, "html");
比如上面的请求,因为是跨域读取数据,所以,无法获取想要的数据jsonp是非官方协议,它是在服务端生成script tags返回到客户端,在客户端通过javscript callback形式实现跨域访问。
jsonp原理是客户端定义一个callback,然后把callback名字传送至服务端,服务端生成json数据,然后以javascript的方式,生成一个以callback名字的function的javascript函数执行形式,将json数据以入参方式放到function中,就 生成了一个js的函数执行语法的文档,传到客户端。客户端浏览器解析script,执行服务端返回的javascript片段,返 回的数据作为参数,传入到客户端定义的callback中动态执行。
实例
http://www.hualai.net.cn/news/website.jsp
<script type="text/javascript">
function sayHello(result){
alert(result());
}
</script>
<script type="text/javascript"src="http://www.hualai.net.cn/news/website2.jsp?callback=sayHello"></script>
http://www.hualai.net.cn/news/website2.jsp
<%
String script="function show(){ return 'hello';}";
//String script="{name:'yuyong'}";
String callback=request.getParameter("callback");
out.println(callback+"("+script+")");
%>
通过jsonp,完美的实现了跨域。
分享到:
相关推荐
html通过 ajax jsonp跨域请求接收和传送数据 使用HTML页面与后台跨域交互,获得后台数据或传输数据给后台
原生Js利用Jsonp跨域实现百度搜索功能
在js里使用Jsonp 实现跨域解决源代码实例
ajax jsonp 跨域处理
ajax jsonp跨域传参,里面有源码,不过写在txt中了,很适合调用别人的接口
使用jsonp跨域获取json数据。Ajax获取JAVA服务器json数据。
ajax跨域CORS方案 JSONP跨域请求方案.zip
JSONP(JSON with Padding)是JSON的一种“使用模式”,可用于解决主流浏览器的跨域数据访问的问题。接下来通过本文给大家介绍JSONP跨域请求实例详解,感兴趣的朋友一起看下吧
jsonp跨域请求数据实现手机号码查询实例分析.docx
原生ajax库,实现jsonp跨域,短小精悍。
jquery下利用jsonp跨域访问实现方法.docx
本篇文章主要介绍了借助node实战JSONP跨域实例,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
本文将给您介绍如何使用getJSON来实现异步跨域提交表单
今天研究了AJAX使用JSONP进行跨域调用的方法,发现使用GET方式和POST方式都可以进行跨域调用,这里简单分享下,方便需要的朋友
JSONP简单调用实例。ASP.NET和纯HTML。jQuery的$.ajax的调用!jsonP说白了,就是在json字符串外面包上一个:参数名称+左右括弧!只是包了个:jsonpCallback() 而已! 相关文章:...
jsonp跨域获取数据的基础教程.docx
jsonp跨域获取百度联想词的方法分析.docx
本文主要介绍了jsonp跨域请求实现示例。具有很好的参考价值。下面跟着小编一起来看下吧
ASPNET_JSONP_demo(jq跨域)
主要介绍了使用jsonp实现跨域获取数据实例讲解,需要的朋友可以参考下