JavaScript/jQuery 检查损坏的链接

IT技术 javascript jquery broken-links
2021-01-28 14:23:28

我开发了一个小的 Javascript/jQuery 程序来访问一组 pdf 文件供内部使用。如果文件确实存在,我想突出显示 pdf 文件的信息 div。

有没有办法以编程方式确定指向文件的链接是否已损坏?如果是这样,如何?

任何指南或建议都被挪用。

6个回答

如果文件在同一个域中,那么您可以使用 AJAX 来测试它们是否存在,正如Alex Sexton所说;但是,您不应使用该GET方法,只需HEAD检查 HTTP 状态的期望值(200,或仅小于 400)。

这是一个相关问题提供的简单方法

function urlExists(url, callback) {
  var xhr = new XMLHttpRequest();
  xhr.onreadystatechange = function() {
    if (xhr.readyState === 4) {
      callback(xhr.status < 400);
    }
  };
  xhr.open('HEAD', url);
  xhr.send();
}

urlExists(someUrl, function(exists) {
    console.log('"%s" exists?', someUrl, exists);
});
仅当服务器允许时。它可以启用/禁用。
2021-03-15 14:23:28
请查阅 JavaScript 的同源政策。
2021-03-30 14:23:28
我收到此代码的错误:“ Access-Control-Allow-Origin 不允许使用Origin localhost。”
2021-04-01 14:23:28
问题中嵌入binarykitten.com/js/88-jquery-plugin-ajax-head-request.html URL 现在是 404,我删除了超链接。
2021-04-06 14:23:28
我希望我知道如何为 OP 的问题实现这一点。任何人?
2021-04-11 14:23:28

问题是 JavaScript 具有同源策略,因此您无法从其他域获取内容。这不会因为投票而改变(想知道 17 票)。我认为您需要它作为外部链接,因此仅使用 .js 是不可能的......

如果文件不在外部网站上,您可以尝试为每个文件发出 ajax 请求。如果它作为失败返回,那么您知道它不存在,否则,如果它完成和/或返回时间超过给定阈值,您可以猜测它存在。它并不总是完美的,但通常“filenotfound”请求很快。

var threshold   = 500,
    successFunc = function(){ console.log('It exists!'); };

var myXHR = $.ajax({
  url: $('#checkme').attr('href'),
  type: 'text',
  method: 'get',
  error: function() {
    console.log('file does not exist');
  },
  success: successFunc
});

setTimeout(function(){
  myXHR.abort();
  successFunc();
}, threshold);

就像塞巴斯蒂安说的那样,由于同源政策,这是不可能的。如果该站点可以(临时)在公共域上发布,您可以使用其中的一种链接检查器服务。我支持checkerr.org

你可以$.ajax对它。如果文件不存在,您将收到 404 错误,然后您可以在错误回调中执行任何您需要的操作(UI 方面)。如何触发请求(定时器?)当然,如果你也有能力进行一些服务器端编码,你可以执行单个 AJAX 请求 - 扫描目录,然后以 JSON 形式返回结果。