0

我正在尝试将 ajax 请求包装到库中。我这样做是因为我不需要在每次发出请求时都设置标头。该库是异步加载的，并且有一个 init 方法来设置 api 密钥。该代码似乎有效，但每次我启动 api 调用时都会收到 2 个请求。图书馆非常基础，远未完成。

发出请求的 api 来自基于 node & express 的 api。当在休息客户端发出相同的请求时，它们都会返回正确的数据和 http 状态代码。

这是加载我的库的代码：

(function(d) {
    var api_key='MY-API-KEY';
    var js,id='tracking-api',ref=d.getElementsByTagName('script')[0];
    if(d.getElementById(id)){return;}
    js=d.createElement('script');js.id=id;js.async=true;
    js.src="/test/track.api.min.js";
    js.onload=function(){stats.init({api_key:api_key})}
    ref.parentNode.insertBefore(js, ref);
})(document);

未缩小的库：

(function(window){

'use strict';

/** 
 *  This library requires jquery to run
 */

var stats= {

    url : 'http://localhost/stats_api/',
    api_key: undefined,

    // The init method will take an api key and set it for our headers
    // used with all api requests
    init: function(opts) {
        if(opts.api_key === undefined) {
            stats.logMsg('Sorry you need to supply an api key');
            return false;
        }
        stats.api_key = opts.api_key;
    },

    // Main api call method nice and simple use - we just give it the
    // method we require and we will be given a json response
    api: function(method, callback) {
        jQuery.ajax({
            url: stats.url + method,
            dataType: 'JSON',
            type: 'GET',
            beforeSend: function(xhr) {
                xhr.setRequestHeader('api_key', stats.api_key);
            },
            success: function(response) {
                callback(response);
            },
            error: function(jqXHR, textStatus, errorThrown) {
                btStats.logMsg(jqXHR);
                btStats.logMsg('Error:' + textStatus);
            }
        });
    },

    // Wrap up the console log function so we can still use it but
    // not break IE8
    logMsg: function(message) {
        if(window.console && console.log) {
            console.log(message);
        }
    }

};

// Attatch our plugin to the window
if(!window.stats){window.stats=stats};

})(window);

我用来发出 api 请求的代码如下所示：

stats.api('/visits', function(response){
    console.log(response);
});

响应总是正确返回，但大多数请求是 404。当它们 404 时，它似乎也第二次运行查询。

所以我想问题是，为什么请求被提出两次？以及为什么 jQuery 在请求成功时返回 404。

4

1 回答 1

1

好的，事实证明这是一个非常简单的问题，因为我的代码正在跨域运行 jQuery 正在使用 OPTIONS 方法发送预检请求（之前没有注意到），404 来自我的节点 api，因为方法是不支持测试我在 api 中添加了一些中间件

app.use(function(req, res, next){

    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "X-Requested-With");
    res.header("Access-Control-Allow-Headers", "api_key");

    if(req.method == 'OPTIONS') {
        res.send(200);
    }
    else {
        next();
    }

});

不理想，因为这将允许所有路由的跨域脚本，所以我将不得不稍后锁定它。

于 2013-03-18T14:07:30.187 回答