关于 josnp ,解决跨域问题

JSONP是服务器与客户端跨源通信的常用方法。最大特点就是简单适用,老式浏览器全部支持,服务器不用做任何改造【使用jsonp的时候jsonp: "callback",callbackde的名字要和 服务器设置保持一致】。

它的基本思想是,网页通过添加一个<script>元素,向服务器请求JSON数据,这种做法不受同源政策限制;服务器收到请求后,将数据放在一个指定名字的回调函数里传回来。

首先,网页动态插入<script>元素,由它向跨源网址发出请求。

1.js原生写法(来自阮大师的博客浏览器同源政策及其规避 http://www.ruanyifeng.com/blog/2016/04/same-origin-policy.html

 1 function addScriptTag(src) {
 2   var script = document.createElement('script');
 3   script.setAttribute("type","text/javascript");
 4   script.src = src;
 5   document.body.appendChild(script);
 6 }
 7 
 8 window.onload = function () {
 9   addScriptTag('http://example.com/ip?callback=foo');
10 }
11 
12 function foo(data) {
13   console.log('Your public IP address is: ' + data.ip);
14 };

 2.jquery写法 (来源http://www.cnblogs.com/lemontea/archive/2012/12/11/2812268.html

1 $("#getJsonpByHand").click(function () {
2     CreateScript("http://localhost:2701/home/somejsonp?callback=jsonpcallback")
3 })
4 function jsonpcallback(data) {
5     console.log(data)
6 }

3.ajax (来源http://www.cnblogs.com/lemontea/archive/2012/12/11/2812268.html

 1 $("#getJsonpByJquery").click(function () {
 2     $.ajax({
 3         url: 'http://localhost:2701/home/somejsonp',
 4         dataType: "jsonp",
 5         jsonp: "callback",
 6         success: function (data) {
 7             console.log(data)
 8         }
 9     })
10 })
原文地址:https://www.cnblogs.com/wteng/p/5370300.html