客户端网站可达性测试

Question

我正在构建一个运行apps.facebook.com系统的Facebook应用程序。这个问题不是专门针对Facebook应用程序的（所以如果您不熟悉这些应用程序，请不要停止阅读）但是您很快就会明白为什么这很重要。

每当用户希望使用该应用程序时，他们将首先访问标准网站（具有更令人难忘的地址，让我们使用示例xyz.com），然后该网站将自动重定向到Facebook应用程序。但是，有两种可能的重定向目标：

1. 到标准的Facebook应用程序页面（例如apps.facebook.com/xyz）。如果客户端可以访问该页面，则会发生这种情况。重要的是，客户可能无法访问此页面的原因是，他们是在运行内容过滤器的网络上（例如学校，大学，一些工作场所）阻止Facebook。

2. 如果客户端无法访问Facebook应用程序页面，则应将其重定向到主网站上的其他页面（例如xyz.com/nofacebook_login.html）。

如您所见，重定向决策需要基于客户端是否可以访问Facebook应用程序页面。因此，测试需要在客户端（大概）使用Javascript，jQuery或类似方法进行。但是，我不确定如何解决这个问题。

任何建议都将不胜感激。

Answer 1

显而易见的解决方案（只是向远程域发送AJAX请求并查看响应是什么）由于同源策略而无效。

您可以要求Facebook实施Cross-origin resource sharing协议。如果他们同意，其余的更容易。但是，如果没有$.ajax - 或原生XmlHttpRequest - 则不会。

但是，虽然XHR受同源策略的约束，但发送HTTP请求的其他方式却不是：您可以使用src上某些图像的apps.facebook.com创建图像，并且看它是否加载。这里的问题是，facebook提供的大部分内容来自akamaihd.net，这不太可能与apps.facebook.com共同阻止。但是，我确实找到了apps.facebook.com提供的一个图像： http://apps.facebook.com/images/spacer.gif（http://facebook.com/images/spacer.gif也存在）。 @RobW还向我指出了favicon（http://apps.facebook.com/favicon.ico）

测试是否可以加载图像：

1. 创建新的img元素
2. 为其添加load侦听器和error侦听器，以执行重定向
3. 设置img src
4. 将图像添加到文档中不应该是必要的，但我没有在任何地方进行测试。

var img = document.createElement("img");
img.onload = function(){location.href = "http://apps.facebook.com/xyz"};
img.onerror = function(){location.href = "http://xyz.com/nofacebook_login.html"};
img.src = "//apps.facebook.com/favicon.ico"; //thanks @RobW
document.body.appendChild(img);

---

注意：Facebook保证图像始终存在。虽然它似乎有一个不错的机会，但它最终可能会消失。如果发生这种情况，每个人都会被阻止（你可能想检查错误代码，但我不知道阻止者返回什么）。如果发生这种情况，请通过新的工作图像通知我或更新此答案。