JSONP解决ajax跨域问题

同源策略,它是由Netscape提出的一个著名的安全策略。现在所有支持JavaScript 的浏览器都会使用这个策略。所谓同源是指,域名,协议,端口相同。当一个浏览器的两个tab页中分别打开来 百度和谷歌的页面,当浏览器的百度tab页执行一个脚本的时候会检查这个脚本是属于哪个页面的,即检查是否同源,只有和百度同源的脚本才会被执行。
缘由浏览器都使用了同源策略,限制住不是同一个域中不能返回信息,这个适合前辈们创造了JSONP
JSONP
JSONP是JSON with Padding的略称。它是一个非官方的协议,它允许在服务器端集成Script tags返回至客户端,通过javascript callback的形式实现跨域访问(这仅仅是JSONP简单的实现形式)。–来源百度
下面提供JS原生JSONP实现代码。供大家学习理解

function jsonp(url, fn) {
    var script = document.createElement('script');
    script.type = 'text/javascript';
    if (script.readyState) {
        script.onreadystatechange = function () {
            if (script.readyState == 'loaded' || script.readyState == 'complete') {
                script.onreadystatechange = null;
                fn instanceof Function && fn.call();
                script.parentNode.removeChild(script);
            }
        };
    }
    else {
        script.onload = function () {
            fn instanceof Function && fn.call();
            script.parentNode.removeChild(script);
        };
    }
    script.src = url;
    document.getElementsByTagName('head')[0].appendChild(script);
}

转载请注明来源:新一 » JSONP解决ajax跨域问题

赞 (0) 评论 (0) 分享 ()

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址