同源策略:首先基于安全的策略,浏览器是存在同源策略机制,同源策略是阻止从一个源加载的文档或者脚本获取或设置另一个源加载的文档的属性。
在电脑上实践:1.随便建立两个网页,保证端口好不一样(2698,2701),按照定义他们是不同源的
2.用jQuery发起不同源的请求
在2698网页上建立一个button,click事件随便发起向2701端口域的请求,
$("#getOtherDomainThings").click(function () { $.get("http://localhost:2701/Scripts/jquery-1.4.4.min.js", function (data) { console.log(data) }) $.get("http://localhost:2701/home/index", function (data) { console.log(data) }) })
根据同源策略,浏览器会阻止发起请求。这下就可以使用jonP解决这个问题。
script标签的跨域能力:
<script type="text/javascript" src="http://localhost:2701/Scripts/jquery-1.4.4.min.js"></script>这样就能成功跳转到2701的网页了。
利用script的跨域能力就是jsonP的基础。
利用script获取不同源的json:既然它叫jsonP,很明显它的目的还是json,而且还是跨域获取值。
利用jQuery获取jsonP:
$("#getJsonpByJquery").click(function () { $.ajax({ url: 'http://localhost:2701/home/somejsonp', dataType: "jsonp", jsonp: "callback", success: function (data) { console.log(data) } }) })
总结:一句话就是利用script标签绕过同源策略获取jsonP。