javascript - 测试 URL 是否可以从 Web 浏览器访问，即确保未被代理服务器阻止

Question

我从 mywebsite.com 为我的网站提供服务。我在 flickr 上托管图像，因此所有图像都通过对 flickr 的获取请求加载到用户的浏览器中。我的许多网站用户从企业网络访问 mywebsite.com，这会阻止对 flickr.com 的访问。这意味着用户会得到非常烦人的空白占位符而不是图像。我在使用 Facebook 点赞按钮时遇到了同样的问题。这使我的网站看起来对这些用户没有吸引力。

有没有一种方法可以运行客户端脚本来检查是否可以访问 flickr.com、facebook.com 等。如果不是，我可以更改图像的 href 属性以从备用源加载，或者替换为标准图像，说明他们的网络正在阻止访问。我还可以删除 Facebook 的点赞按钮。

我认为 XML http 请求可以解决问题，但后来我认为遇到了跨域问题。我想我也可以设置一个代理来提供图像，但我不想那样做；这样做的想法是让 flickr 承受带宽冲击。

TLDR:如何使用客户端技术确定用户浏览器是否可以访问 flickr.com。

Answer 1

你可以试试这个...

var image = new Image();

image.onerror = function() {

   var images = document
                 .getElementById('flicker-images')
                 .getElementsByTagName('img');

   for (var i = 0, imagesLength = images.length; i < imagesLength; i++) {
        images[i].src = 'images/flickr_is_blocked.gif';
   }

};

image.src = 'http://flickr.com/favicon.ico';

Hacky，但它似乎有效。然而，它依赖于 favicon.ico 404ing 意味着主站点是。

jsFiddle .