使用 JavaScript 进行 URL 验证/连接

发布于 2024-12-07 06:18:29 字数 319 浏览 0 评论 0原文

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

我想通过测试使用 AJAX 来实现此目的： if (xmlhttp.readyState == 4 && xmlhttp.status == 200) 但这似乎不适用于远程服务器（外部 url）。由于我的服务器使用代理，我计划使用浏览器端脚本，以便它自动使用用户的浏览器代理（如果存在）。请告诉我是否必须使用“AJAX跨域”？如何实现这一点，因为我只是想验证一个网址。除了使用AJAX还有其他方法吗？

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

橘和柠 2024-12-14 06:18:29

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

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

回复收藏 0 原文

所谓喜欢 2024-12-14 06:18:29

避免跨域问题的常用方法是注入标签。图像或脚本等标签可以从任何域加载其内容。您可以注入一个类型为“text/x-unknown”或其他类型的脚本标签，然后监听标签加载事件。当加载事件触发时，您可以再次从页面中删除脚本标签。

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

更新

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

它不适用于旧版本的 IE（至少是 IE8），因为显然它们不提供脚本标签的加载/错误事件。

如果脚本标签的内容类型不为空或设置为“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>

The usual way to avoid cross-domain issues is to inject a tag. Tags like image or script kan load their content from any domain. You could inject, say a script tag with type "text/x-unknown" or something, and listen to the tags load-event. When the load event triggers, you can remove the script tag from the page again.

Of course, if the files you are looking for happens to be images, then you could new Image() instead. That way you don't have to pollute the page by injecting tags, because images load when they are created (this can be used to preload images). Again, just wait for the load event on the image.

UPDATE

Okay, it seems I am jumping to conclusions here. There is some differences between browsers on how this can be supported. The following is a complete example, of how to use the script tag for validating urls in IE9 and recent versions of Firefox, Chrome and Safari.

It does not work in older versions of IE (IE8 at least) because apparently they don't provide load/error events for script-tags.

Firefox refuses to load anything if the contenttype for the script-tag is not empty or set to 'text/javascript'. This means that it may be somewhat dangerous to use this approach to check for scriptfiles. It seems like the script tag is deleted before any code is executed in my tests, but I don't for sure...

Anyways, here is the code:

<!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>

回复收藏 0 原文

~没有更多了~