Question

我正在尝试编写一个脚本来测试页面上的所有锚标记是否正常工作。基本上，我只是想确保链接没有被破坏。我认为最好的方法是遍历页面上的所有锚标记并向该URL发送http请求。请参阅以下代码：

function testClicks() {

    for (var i = 0, allLinks = document.links.length; i < allLinks; i++) {
        var thisLink = document.links[i].href,
            http = new XMLHttpRequest();
        http.open('GET', thisLink, false);
        http.send();
        var resonse = http.status;
        console.log(response);
    }

};

目前我只是测试谷歌和雅虎等基本链接。现在这是我得到的错误。

Uncaught NetworkError: Failed to execute 'send' on 'XMLHttpRequest': Failed to load 'http://www.google.com/'.

我在想我不应该使用GET方法。对此问题的任何见解都会有所帮助。香草Javascript只请！没有jQuery。

谢谢，

Answer 1

如果您尝试从不支持CORS的服务器加载XMLHttpRequest资源，您的浏览器会抱怨。

可能的解决方法是假装资源是Image。

编辑尝试过，它没有工作（在Chrome中） - 将HTML页面下载到<img>元素导致error事件触发而不是load事件，如果网址甚至不存在，我无法通过任何方式将其与error触发的事件区分开来：（

Answer 2

google.com.ua不允许发出跨域请求，这就是您收到错误的原因。尝试向其他域发出请求。是的，必须在它们上启用跨源。此变体仅适用于AJAX请求。

我建议在javascript中使用ping这样的东西。您可以在此处找到工作示例 - http://jsfiddle.net/GSSCD/203/

上述示例的主要思想 - 使用图片及其回调onload来检测此域是否可用。

P.S。我意识到这个AJAX请求助手（可能会有所帮助）：

ajax: function(url, cb, data, method) {
        url = url ? url : '';
        cb = typeof cb == 'function' ? cb : function() {};
        data = data ? data : {};
        method = method ? method : 'GET';

        var request = new XMLHttpRequest();
        request.open(method, url, true);
        request.onload = function() {
            if (this.status >= 200 && this.status < 400) {
                cb.call(this, this.responseText);
            } else {
                cb.call(this);
            }
        };
        request.onerror = function() {
            cb.call(this);
        };
        request.send(this.getQueryUrl(data)); // You can pass just `null` to send

        return this;
    }

Answer 3

您还可以使用try...catch块直接处理抛出的异常：

try {
    http.send();
    var resonse = http.status;
    console.log(response);
} catch (e) {
    console.log(e);
    // Do a fallback, call a failure callback, etc.
}

Answer 4

使用AJAX调用您自己的本地PHP文件，该文件使用cURL检查链接。我自己使用这种方法来处理我目前管理的所有网站（以及一些像Google这样的控制网站），并且它在本地运行良好。远程，结果可能会有所不同......我认为某些主机可能不喜欢某些其他主机，但我还没有测试过这个理论。

http://php.net/manual/en/function.curl-init.php

你可以用任何符合你需要的方式建造它，这里是对我的工作方式的解释。

构建所有网址的javascript数组，以测试链接是否有效（工作网站或关闭网站或损坏的链接）
对我的PHP文件中的每个项目进行AJAX调用（$ _GET [＆＃39; url＆＃39;]）
PHP文件使用cURL获取要检查的URL的标题，并以我喜欢的格式返回结果
处理结果，在我的情况下，我根据HTTP响应代码将结果输出到列表/结构和颜色代码中。

如果您将此代码放在实际网站上，您可能会根据您的主机（我做过）获得不同的结果。为了我自己检查我自己的网站是否正常运行的目的，我在XAMPP本地使用此代码。

Answer 5

JavaScript上不允许交叉原始请求...我遇到了类似的问题...代码在Java中工作但在JavaScript中没有。 JavaScript和服务器端脚本都必须位于同一台服务器上，因此您无法执行诸如向Google发送请求等内容...

如何测试页面上的链接是否有效

5 个答案: