Question

在主流浏览器的最新版本中，所有内容都在同一个域上运行。

 var xmlhttp = new XMLHttpRequest();
 var sites = ["/page1", "/page2", "/page3"];
 var cache = {};

 function xhrStart(url) {
   xmlhttp.open("GET", url, true);
   xmlhttp.send();
 }

 function isOkXhr() {
   return (xmlhttp.readyState == 4 &&
     (xmlhttp.status >= 200 && xmlhttp.status < 300));
 }

 function reload() {
   var len = sites.length;
   var i;
   for (i = 0; i < len; i++) {
     var url = sites[i];

     xmlhttp.onreadystatechange = function() {
       if (isOkXhr())
         cache[url] = xmlhttp.responseText;
     }
     xhrStart(url);
   }
 }

重新加载函数应该是缓存所有页面，但实际上所有查询都在调试器中返回Aborted，除了最后一个。可能是什么问题？

Answer 1

您正在使用一个XHR对象并继续在循环中写入它。当您调用open（）时，它会中止先前的请求。 for循环不等待请求。

创建新的XHR请求或等到其他请求完成后再发出下一个请求。

var sites = ["/page1", "/page2", "/page3"];
var cache = {};

function xhrStart(url) {
   var xmlhttp = new XMLHttpRequest();
   xmlhttp.open("GET", url, true);
   xmlhttp.onreadystatechange = function() {
       if (xmlhttp.readyState == 4) {
           if(xmlhttp.status >= 200 && xmlhttp.status < 300) {
               cache[url] = xmlhttp.responseText;
           } else {
               //what are you going to do for error?
           }
       }       
   };
   xmlhttp.send();
}

for (var i = 0; i < sites.length; i++) {
    var url = sites[i];
    xhrStart(url);
}

使用XMLHttpRequest缓存页面

1 个答案: