AngularJS的JSONP服务

有些页面的response中，包含了 Access-Control-Allow-Origin 这个header，说明可以进行跨域请求,如果没有包含这个header的页面可以利用JSONP进行跨域

script标签中的src属性可以也实现跨域,,下面我们来简单封装利用script标签实现跨域的函数。

步骤：

1. 创建script标签
2. script标签的src属性等于url

　　　　a)       url中有回调函数和参数

　　　　b)      回调函数需要写入window中

                      i. 调用的函数名不能为同一个,否则会被覆盖

                      ii. 所以利用随机数(转换为字符串,然后去掉前两位0和小数点)让函数名不同

　　　　c)       参数以对象形式传入,需要遍历,与url进行连接

　　3.  将标签插入body中

　　4.  移除script

代码：

function getJsonp(url,params,callback){
        //创建script标签
        var script=document.createElement("script");
　　　　　//生成随机的回调函数名
        var name="JSONP"+Math.random().toString().substring(2);
        window[name]=function(data){
            callback(data);
        }
        var strUrl=url+"?callback="+name;
        for(key in params){
            strUrl+="&"+key+"="+params[key]
        }
        script.src=strUrl;
        document.body.appendChild(script);
        document.body.removeChild(script);
    }

了解原理即可，现在有很多插件可以解决这个问题

 

转载于:https://www.cnblogs.com/AnnieShen/p/6017548.html