同时 xhr 请求的最大数量？

Question

我正在制作一个小型网络应用程序，允许用户拖动滑块来显示不同的内容。每次移动滑块时，客户端都会使用 HTML5 地理定位来获取其位置，然后向服务器发送 XMLHttpRequest 以获取新内容。

问题是，如果用户移动滑块的次数过多且速度过快，则会导致错误。

代码：

function update(){

    var xhr = new XMLHttpRequest();
    var url = "request_handler.php";
    xhr.open("POST", url, true);
    xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

    xhr.onreadystatechange = function() {
        if(xhr.readyState == 4 && xhr.status == 200) {
            var return_data = xhr.responseText;
            //doing stuff
        }
    }
    // since HTML5 Geolocation is a asynchronous function, and i have to make 
    // sure that i get the users clients position before i send the request, i  
    // pass the sendRequest function below as a callback function to the 
    // Geolocation function
    function sendRequest(latitude,longitude) {

        try{
            xhr.send("latitude=" + latitude + "&longitude=" + longitude);
            console.log("Success")
        }
        catch(err){
            console.log("Error message: %s",err);
        }        

    }
    //This function gets user position and then calls sendRequest if it was
    //Successfull
    Geoposition.updatePosition(sendRequest);
}
//EDIT:
var Geolocation = {
    sendRequestFunction: null,
    options: {
        enableHighAccuracy: true,
        timeout: 5000,
        maximumAge: 0
    },
    success: function(pos) {
        if (sendRequestFunction) {
        sendRequestFunction(pos.coords.latitude, pos.coords.longitude);
        };
    },
    error: function(err) {
        console.warn('ERROR(' + err.code + '): ' + err.message);
    },
    updatePosition: function(callbackFunction) {
        sendRequestFunction = callbackFunction;
        navigator.geolocation.getCurrentPosition(Geolocation.success, Geolocation.error, Geolocation.options);
    },
};

如您所见，我在发送请求函数周围有一个 try-catch。这些是我在 ff 和 chrome 中收到的错误消息，当我快速移动滑块多次时。

Firefox: "Error message: [Exception... "失败" nsresult: “0x80004005 (NS_ERROR_FAILURE)” 位置：“JS 框架 :: http://localhost/***/myscript.js::sendRequest::第 29 行"数据：没有]"
Chrome: "错误信息: DOMException: 执行 'send' 失败 'XMLHttpRequest': object 的状态必须是打开的。"

我正在 Wampserver2 上尝试这个（它使用 Apache 服务器）。

所以我的问题真的是：怎么了？我在某处读到浏览器只允许同时发出一定数量的 xhr 请求（如果没记错的话大约 6-7）。虽然如果我只快速拖动滑块 3-4 次我会得到这个错误，但这可能是问题所在吗？有更好的方法吗？

编辑：添加了 updatePosition() 函数。它在我称为 Geoposition 的命名空间中。

编辑 2：如果你是因为标题来到这里，这个问题与我怀疑的任何"maximum amount of simultaneous xhr request"无关。

Answer 1

除了 sendRequestFunction 是 implicit global 而不是您的本地 GeoLocation 属性，您不得在异步 updatePosition 方法中使用自由变量。后续调用将覆盖先前的值，稍后调用您的 getCurrentPosition 回调时，它们中的每一个都将调用相同的 sendRequestFunction。这对您的 xhr 对象来说是致命的，因为它不喜欢被多次发送（这正是错误消息所说的，请求处于 send() 无效的状态）。

var Geolocation = {
    options: {
        enableHighAccuracy: true,
        timeout: 5000,
        maximumAge: 0
    },
    error: function(err) {
        console.warn('ERROR(' + err.code + '): ' + err.message);
    },
    updatePosition: function(callbackFunction) {
        navigator.geolocation.getCurrentPosition(function(pos) {
            if (typeof callbackFunction == "function") {
                callbackFunction(pos.coords.latitude, pos.coords.longitude);
            }
        }, Geolocation.error, Geolocation.options);
    }
};

此外，您可能需要考虑限制地理定位和 ajax 通话。

同时 xhr 请求的最大数量？

Maximum amount of simultaneous xhr requests?

javascript

xmlhttprequest