检查链接是否正常工作，如果使用HTML / JavaScript破坏，则隐藏/禁用

Question

所以我正在使用HTML / CSS构建我的网站。我想知道检查URL是否可用的最简单方法是什么？

例如，我有一个表格，其中包含一个显示某个URL链接的单元格 -

   <table class="table table-hover table-bordered table-condensed" cellspacing="0" width="1300" id="ServerTable">
<thead>

  <tr>
    <th><center> #</center></th>
    <th width="100%"><center>  Server Name </center></th>
    <th><center>  Owner </center></th>
    <th><center>  Project </center></th>
    <th width="100%"><center>  Description </center></th>
    <th width="100%"><center>  IP Address </center></th>
    <th width="100%"><center> ILO </center></th>
    <th><center>  Rack </center></th>
    <th><center>  Status </center></th>
    <th><center>  Actions   </center></th>


    </tr>
    </thead>
<tbody>

            {% for server in posts %}


    <tr>
      <div class ="server">
        <td></td>
        <td width="100%"><center>{{ server.ServerName }}</center></td>
        <td width="100%"><center>{{ server.Owner }}</center></td>
        <td width="100%"><center>{{ server.Project }}</center></td>
        <td width="100%"><center>{{ server.Description }}</center></td>
        <td width="100%"><center>{{ server.IP }}</center></td>
        <td width="100%"><center><a href="//{{ server.ServerName }}.ilo.lab.dba.co.il"> http://{{ server.ServerName }}.ilo.lab.dba.co.il </a></center></td>
        <td width="100%"><center>{{ server.Rack }}</center></td>
        <td width="100%"><h4><span class="badge badge-success">Online</span></h4></td></center>

在这个单元格中，有一个链接到某个URL。我想仅在http：// {{server.ServerName}}。ilo.lab.dba.co.il正在使用http工作时才将链接显示为URL（a href）！ （server.ServerName是在for循环中运行的变量，给出不同的DNS URL）如果不是，我将只显示一个文本，或者不显示所有内容......

我在Javascript中发现了一些返回true和false的函数，但我不知道如何在我的html中调用该函数。就像，我想做if（链接工作）：显示与href的链接，否则：只显示字符串...

可以使用Javascript函数吗？如果是这样，功能是什么，我该怎么称呼它？

我找到的函数示例：

如何在我的代码中使用和测试它？使用href如果是真的吗？

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

Answer 1

由于您的应用程序后端是Django，我建议您使用Python来检查基于http的URL是否可用。

根据@T。 J. Crowder建议，跟踪实现checkUrlAvailable(url)方法的链接/问题，并以URL作为参数。

我找到了Built-in template tags and filters的文档，展示了如何在Django模板中应用过滤器。

总而言之，我们可以将所有内容组合在一起，如下所示：

<td width="100%"><center>
   {% if checkUrlAvailable(server) is True %}
      <a href="//{{ server.ServerName }}.ilo.lab.dba.co.il"> http://{{ server.ServerName }}.ilo.lab.dba.co.il </a>
   {% else %}
      http://{{ server.ServerName }}.ilo.lab.dba.co.il
   {% endif %}
</center></td>

我遇到的问题是使用Python检查不存在的服务器/ URL。一旦解决，我会尽快更新这个问题。

要在Django模板中编写checkUrlAvailable，请查看documentation。我们的想法是构建一个自定义过滤器来检查给定URL的存在。伪代码可能看起来像以下但我争论潜入这些answers：

import requests

def checkUrlAvailable(url):
    resp = requests.head(url)
    if resp.status_code == 200:
       return True
    else
       return False

我刚刚从stackoverflow的链接中借用了代码片段代码。

（即将更新）

Answer 2

假设您的页面不是托管在http://10.0.5.1上，除非目标服务器允许，否则没有通用的方法从浏览器执行此操作，并且单独执行此操作可能并不理想。

如果您的目标页面的原点与页面的原点不同，则Same Origin Policy会启动并阻止您使用ajax（XMLHttpRequest，fetch）来检查链接。如果你可以在所有目标服务器上实现Cross-Origin Resource Sharing，告诉他们给你的页面访问权限，你可以解决这个问题。但同样：请求页面上链接的所有资源，即使使用HEAD请求，也可能不理想。

您已使用PHP标记了您的问题。在返回页面之前，您当然可以使用PHP来检查链接。 This question's answers展示了如何对URL进行HEAD请求。

您还标记了Django，一个Python服务器端框架。您也可以使用Python执行HEAD请求; this search出现了this question及其答案。