javascript - 确定链接在用户单击时是否有效

Question

我提供了一个小部件，用户可以在其中存储他们创建的链接。

换句话说，他们:

1. 点击添加链接
2. Modal 弹出，他们输入信息:链接标题、链接 URL、订单
3. 通过 AJAX 将其保存到数据库，然后刷新小部件以显示他们创建的所有用户链接。

我想做的是当用户点击他们的链接时，确定链接是否存在(可能不在这个域上所以我可以看到一个可预见的问题 w/AJAX)如果它确实存在然后继续正常打开新窗口并送他们上路。

但是，如果不是这样的话，我想生成一条类似 Growl Like 的消息。

I'm sorry that Link Does not exist, please verify your link.

我基本上需要在客户端验证链接存在的方法。这甚至可能吗？

Answer 1

您可以使用 jquery 在所有链接上附加一个 click() 事件处理程序，然后尝试在隐藏的 iframe 中加载 URL，如果成功则在新窗口中打开链接.请注意，这是一种非常昂贵的链接检查方式。也许可以做一些更聪明的事情，比如 HTTP 头请求。

编辑:

在这里找到了解决方案(尽管仅适用于纯 javascript):HTTP HEAD Request in Javascript/Ajax?

function UrlExists(url)
{
  var http = new XMLHttpRequest();
  http.open('HEAD', url, false);
  http.send();
  return http.status!=404;
}

jQuery 解决方案来自这里:Ajax HEAD request via Javascript/jQuery

ajaxSizeRequest = $.ajax({
    type: "HEAD",
    async: true,
    url: url,
    success: function(message){
    }

正如@Matt King 指出的那样，这些实际上是非常无用的跨域 - 在这种情况下，我会在您的应用程序中设置一个 proxy.aspx 页面，您改为查询。然后，该代理必须在 C# 中执行 HTTP HEAD 请求，并将结果(成功/失败)返回给客户端/jQuery。