使用javascript的URL验证/连接

URL validation/connectivity using javascript

本文关键字:连接 验证 URL javascript 使用      更新时间:2023-09-26

我想验证外部url是否有效/存在/响应使用javascript。例如,"www.google.com"应该返回true,而"www.google123.com"应该返回false。

我想通过测试使用AJAX来达到这个目的:readyState == 4 &&xmlhttp。状态== 200),但似乎这对远程服务器(外部url)不起作用。由于我的服务器使用代理,我计划使用浏览器端脚本,以便它自动使用用户的浏览器代理(如果存在)。请告诉我,我是否必须使用"AJAX跨域"?如何实现这一点,因为我只是想验证一个url。除了使用AJAX还有其他方法吗?

我很确定这是不可能的。任何允许您在用户上下文中调用另一个域上的随机页面的AJAX都会打开各种安全漏洞。

您必须使用服务器端解决方案。

避免跨域问题的通常方法是注入标记。像图像或脚本这样的标签可以从任何域加载其内容。您可以注入一个类型为"text/x-unknown"之类的脚本标记,然后监听标记的load-event。当加载事件触发时,您可以再次从页面中删除脚本标记。

当然,如果您正在查找的文件恰好是图像,那么您可以使用new Image()。这样,您就不必通过注入标记来污染页面,因为图像是在创建时加载的(这可以用于预加载图像)。同样,只需等待图像上的加载事件。

好吧,看来我在这里过早下结论了。浏览器之间在如何支持这个方面存在一些差异。下面是一个完整的例子,说明如何在IE9和最新版本的Firefox、Chrome和Safari中使用script标签来验证url。

它不工作在旧版本的IE(至少IE8),因为显然他们不提供加载/错误事件的脚本标签。

如果script-tag的内容类型不为空或设置为'text/javascript', Firefox将拒绝加载任何内容。这意味着使用这种方法检查脚本文件可能有些危险。在我的测试中,似乎在执行任何代码之前删除了脚本标签,但我不确定…

无论如何,下面是代码:

<!doctype html>
<html>
<head>
    <script>
        function checkResource(url, callback) {
            var tag = document.createElement('script');
            tag.src = url;
            //tag.type = 'application/x-unknown';
            tag.async = true;
            tag.onload = function (e) {
                document.getElementsByTagName('head')[0].removeChild(tag);
                callback(url, true);
            }
            tag.onerror = function (e) {
                document.getElementsByTagName('head')[0].removeChild(tag);
                callback(url, false);
            }
            document.getElementsByTagName('head')[0].appendChild(tag);
        }
    </script>
</head>
<body>
    <h1>Testing something</h1>
    <p>Here is some text. Something. Something else.</p>
    <script>
        checkResource("http://google.com", function (url, state) { alert(url + ' - ' + state) });
        checkResource("http://www.google.com/this-does-not-exists", function (url, state) { alert(url + ' - ' + state) });
        checkResource("www.asdaweltiukljlkjlkjlkjlwew.com/does-not-exists", function (url, state) { alert(url + ' - ' + state) });
    </script>
</body>
</html>