Question

是否存在仅客户端方法来检测托管在另一个域上的xml文件是否丢失（响应404）或使用Internet Explorer可用？ CORS不是一种选择。我只关心它的存在。

通过将<script>代码注入与回调结合到“加载”和“错误”事件，Chrome和Firefox只存在一种客户端方法。下面是我在Firefox和Chrome浏览器控制台中放置的测试代码。

在Internet Explorer中，无论文件是否存在，“readystatechange”事件始终会触发。我已经从'readystatechange'回调中检查了返回的对象，我似乎无法找到现有文件的响应对象与不存在的文件中的响应对象之间的区别。

我还尝试使用<img>代码和<iframe>代码注入，但结果对于任何浏览器的<script>代码注入都没有帮助。

function loadFile(urlOfDocument) {
    var element = document.createElement('script');
    element.async = true;

    element.onload = function() {
        // Works for Chrome and Firefox
        console.log("onload called");
    }
    element.onerror = function() {
        // Works for Chrome and Firefox
        console.log("onerror called");
    }
    element.onreadystatechange= function () {
        // IE 8, 9, 10
        console.log("onreadystatechange: ", element.readyState);
        if (this.readyState == 'complete') {
            console.log("loading complete");
        }
    }
    element.src = urlOfDocument;
    document.getElementsByTagName('head')[0].appendChild(element);
}

var urlOfDocument = "http://url.to.missing.file";
loadFile(urlOfDocument);

Answer 1

我还没有完全测试过，但它可能会有效。由于您希望加载XML，如果它确实存在并且加载到脚本中，浏览器将在解析文件时抛出syntax error，如果它返回404，则不会出现错误，所以你可以为IE添加以下内容

    if (this.readyState == 'loading') {
       window.onerror = function(e){
          if(! (e === "Syntax error") ) return;
          console.log("File Exits");
          window.fileExists = true;
       }
    }
   if (this.readyState == 'loaded') {
       //if we got here without an error the file is missing. 
       if(!window.fileExists){
           console.log("File is missing");
       }
       //clean up
       window.onerror = "";
    }

注意：这不适用于有效的脚本文件。

希望这有帮助

使用脚本标记检测Internet Explorer上的xml加载失败

1 个答案: