美文网首页
jsonp跨域

jsonp跨域

作者: 希染丶 | 来源:发表于2019-07-29 19:56 被阅读0次

    在js中,我们直接用XMLHttpRequest请求不同域上的数据时,是不可以的。但是,在页面上引入不同域上的js脚本文件却是可以的,jsonp正是利用这个特性来实现的。

    // 封装一个方法
    function(){
    var jsonp = function(url, data, callback){
            // 1.判断url中是否带有参数
            var dataString = url.indexof('?') == -1? '?': '&';
            // 2.把参数拼接起来
            for(var key in data){
                dataString += key + '=' + data[key] + '&';
            };
            // 3.创建script标签
            var scriptEle = document.createElement('script');
            scriptEle.src = url + dataString;
            
            // 4.挂载回调函数
            window[cbFuncName] = function (data) {
                callback(data);
                // 处理完回调函数的数据之后,删除jsonp的script标签
                document.body.removeChild(scriptEle);
            }
    
            // 5. append到页面中
            document.body.appendChild(scriptEle);
    }
    }(window,document)
    

    相关文章

      网友评论

          本文标题:jsonp跨域

          本文链接:https://www.haomeiwen.com/subject/xjxirctx.html