两个ajax调用,只有一个正在运行

时间:2015-12-22 22:43:34

标签: javascript ajax

我有以下http变量,它返回一个对象:

var http = (function(){

    var success = null;
    var error = null;
    var requestInfo = {content: '', status: 0};

    var core = {
        request: function(options){
            var $http = Object.create(http);
            sendRequest(options).then(function(){
                if(typeof(success) == 'function'){
                    success(requestInfo.content);
                }
            }, function(){
                if(typeof(error) == 'function'){
                    error(requestInfo.content);
                }
            });
            return $http;
        },
        success: function(callback){
            success = callback;
            return this;
        },
        error: function(callback){
            error = callback;
            return this;
        }
    };

    function sendRequest(options){
        return new Promise(function(resolve, reject){
            var xhttp = new XMLHttpRequest();
            var method = options.method.toUpperCase();
            xhttp.onreadystatechange = function() {
                if(xhttp.readyState == 4){
                    requestInfo.content = JSON.parse(xhttp.responseText) || xhttp.responseText;
                    requestInfo.status = xhttp.status;
                }
                if (xhttp.readyState == 4 && xhttp.status == 200) {
                    resolve(requestInfo);
                }else if(xhttp.readyState == 4 && xhttp.status != 200){
                    reject(requestInfo);
                }else if(xhttp.status >= 400){
                    reject(requestInfo);
                }
            };
            xhttp.open((method || 'GET'), options.url, true);
            var data = options.data || '';
            xhttp.setRequestHeader('X-CSRF-TOKEN', document.querySelector('meta[name="csrf-token"]').getAttribute('content'));
            if((typeof(data) == 'object' && (Object.keys(data).length > 0) || data.length > 0)){
                xhttp.send(JSON.stringify(data));
            }else{
                xhttp.send();
            }
        });
    }

    return core;
})();

如果我同时多次调用它,就像这样:

http.request({url: '/path1'}).success(function(){
    alert('success');
});
http.request({url: '/path2'}).success(function(){
    alert('success');
});

只有一个项目通过ajax传递,而另一个项目没有。是什么造成的?我认为做Object.create(this)会使每个人彼此独特,但它似乎并没有这样做......

3 个答案:

答案 0 :(得分:0)

  

Object.create()方法使用指定的原型对象和属性创建一个新对象。

因此,您使用相同的原型创建了2个对象,并且数据位于原型本身中。由于原型是一个对象,并且它是相同的,因此两个结果对象对它们的数据对象和函数都有相同的引用。

您需要指定不在原型对象中的数据,而是为每个实例指定数据。

因此,在创建class N32 def +( other ) 2 end end a = N32.new a + 3 # return 2 3 + a # return error N32 can't be coerced into Fixnum 后,您必须将数据添加到var $this = Object.create(this);,例如$this,否则下一次调用将覆盖此数据。

答案 1 :(得分:0)

用于存储回调函数的sucesserror变量必须在request函数中创建,以便每个请求真正唯一。但是,如果你要使用Promises,我建议使用load对象可用的errorXMLHttpRequest事件监听器来简化整个交易(一个很好的例子)可以在MDN的XMLHttpRequest文章中找到),只需传递成功和失败函数,就可以使用Promise实例的then方法。

这是一个简化的JSFiddle示例,使用超时来模拟500毫秒的HTTP请求。

答案 2 :(得分:0)

问题在于这一行:

cd dir
for file in *; do
    if [ -f "$file" ]; then
        newpath="${file:0:1}/${file:1:1}"
        mkdir -p "$newpath"
        cp "$file" "$newpath"
    fi
done

我没有在var method = options.method.toUpperCase(); 中设置method属性,并且没有错误说它无法发送,它基本上只是在没有警告的情况下退出方法...

我把它更改为:

options

它开始起作用了。