JSONP

来源:互联网 发布:c语言static volatile 编辑:程序博客网 时间:2024/06/16 18:28

JSONP是利用浏览器对script的资源引用没有同源限制,通过动态插入一个script标签,当资源加载到页面后会立即执行的原理实现跨域的。JSONP是一种非正式传输协议,该协议的一个要点就是允许用户传递一个callback或者开始就定义一个回调方法,参数给服务端,然后服务端返回数据时会将这个callback参数作为函数名来包裹住JSON数据,这样客户端就可以随意定制自己的函数来自动处理返回数据了。
之前有看到一个有形象的解释:Jsonp:json+padding(内填充),把json当做内填充东西,填充到盒子中。

//JSONP代码,转自switerfunction () {    var _cbs = {}    var _ns = '_jsonp'    var _pn = 'callback'    var _id = 0    var _t = 20000    function noop () {}    function jsonp (url, cb, options) {        options = options || {}        cb = cb || noop        var s = document.createElement('script')        var cid = _ns + _id ++        var ended        window[cid] = function (data) {            onsuccess(data)            window[cid] = onsuccess = onerror = noop        }        function onsuccess (data) {            document.head.removeChild(s)            cb(null, data)        }        function onerror (e) {            document.head.removeChild(s)            cb(e || 'error')            window[cid] = onsuccess = onerror = noop        }        s.onerror = s.onabort = function (e) {            onerror(e ? e.type : 'error')        }        url = url.replace(/[\?\&]$/, '')        url = url + (~url.indexOf('?') ? '&' : '?') + _pn + '=' + cid        s.src = url        document.head.appendChild(s)        setTimeout(function () {            onerror('timeout')        }, options.timeout || _t)    }    jsonp.timeout = function (t) {        _t = t    }    jsonp.ns = function (n) {        _ns = n    }    jsonp.pn = function (n) {        _pn = n    }    /**     *  Global namespace is "Routed"     */    if (typeof module !== 'undefined' && module.exports) module.exports = jsonp    else if (typeof exports !== 'undefined') exports.jsonp = jsonp    else window.jsonp = jsonp}();
原创粉丝点击