动态 JSONP 方法

Question

我想知道我的 JSONP 方法是否正确，如果不正确，我可以改变什么。

我的标准 JSONP 方法：

Server

标准 ?jsonp=callback 参数

Client

1. 调用函数（示例：jsonp(url, callback)） *1
2. 创建a
3. 执行脚本
4. 删除脚本标签

Code
注意：我刚刚在 stackoverflow 编辑器中编写了所有这些内容，代码未经测试
1：

jsonp("http://example.com/sampleAPI", function(result) {  
    // Do something  
});

2：

var callbackID = 0;
var jsonp = function(url, callback) {
    var callbackName = 'callback' + callbackID;
    // put the callback in the URL
    callbackID++;
    if (url.indexOf('?') != -1) {
        url += '&jsonp=' + callbackName;
    } else {
        url += '?jsonp=' + callbackName;
    }

    // create the callback
    window[callbackName] = function(result) {
        $('jsonpScriptElement' + callbackID).remove();
        callback(result);
        window.splice(callbackName);
    }

    // Create the actual element (do this as the last thing because of caching)
    // Assuming prototype.js usage
    $$('body')[0].insert(new Element('script', {'href': url, 'id': 'jsonpScriptElement' + callbackID}));
}

Answer 1

我看到的唯一问题是这一部分：

window[callbackName] = function(result) {
    $('jsonpScriptElement' + callbackID).remove();
    callback(result);
    window.splice(callbackName);
}

您正在为您所做的每个调用创建一个新函数。尝试通过创建一个仍然可以安全异步使用的通用函数来避免这种情况。想出一些东西应该不会太难。例如，您可以将序列号传递给 JSONp 调用并返回给回调，这样您就可以将不同的请求分开。

是的，JSONp 确实就是这么简单：P

此外，您可以将 JSONp 函数更改为：

var jsonp = (function() {
    var callbackID = 0;
    return function (url, callback) {
         //.. function body ..
    }
}());

因此您不必在全局范围内声明 callbackID