依赖库: https://www.npmjs.com/package/valid-url

import { isWebUri } from 'valid-url';
// ...
if (!isWebUri(url)) {
    return "Not a valid url.";
}

使用javascript验证Url如下所示

function ValidURL(str) {
  var regex = /(?:https?):\/\/(\w+:?\w*)?(\S+)(:\d+)?(\/|\/([\w#!:.?+=&%!\-\/]))?/;
  if(!regex .test(str)) {
    alert("Please enter valid URL.");
    return false;
  } else {
    return true;
  }
}

我认为使用本地URL API比@pavlo建议的复杂正则表达式模式更好。虽然它有一些缺点，但我们可以通过一些额外的代码来修复。对于以下有效url，此方法失败。

//cdn.google.com/script.js

我们可以预先添加缺失的协议来避免这种情况。它也无法检测以下无效的url。

http://w
http://..

那么为什么要检查整个url呢?我们可以检查定义域。我借用正则表达式从这里验证域。

function isValidUrl(string) {
    if (string && string.length > 1 && string.slice(0, 2) == '//') {
        string = 'http:' + string; //dummy protocol so that URL works
    }
    try {
        var url = new URL(string);
        return url.hostname && url.hostname.match(/^([a-z0-9])(([a-z0-9-]{1,61})?[a-z0-9]{1})?(\.[a-z0-9](([a-z0-9-]{1,61})?[a-z0-9]{1})?)?(\.[a-zA-Z]{2,4})+$/) ? true : false;
    } catch (_) {
        return false;
    }
}

主机名属性是javascript:void(0)的空字符串，所以它也适用于此，你也可以添加IP地址验证器。我最喜欢坚持使用本地API，并希望它在不久的将来开始支持一切。

使用validator.js

ES6

import isURL from 'validator/lib/isURL'

isURL(string)

不ES6

var validator = require('validator');

validator.isURL(string)

您还可以通过将可选options对象作为isURL的第二个参数来微调此函数的行为

下面是默认的选项对象:

let options = {
    protocols: [
        'http',
        'https',
        'ftp'
    ],
    require_tld: true,
    require_protocol: false,
    require_host: true,
    require_valid_protocol: true,
    allow_underscores: false,
    host_whitelist: false,
    host_blacklist: false,
    allow_trailing_dot: false,
    allow_protocol_relative_urls: false,
    disallow_auth: false
}

isURL(string, options)

Host_whitelist和host_blacklist可以是主机的阵列。它们还支持正则表达式。

let options = {
    host_blacklist: ['foo.com', 'bar.com'],
}

isURL('http://foobar.com', options) // => true
isURL('http://foo.bar.com/', options) // => true
isURL('http://qux.com', options) // => true

isURL('http://bar.com/', options) // => false
isURL('http://foo.com/', options) // => false


options = {
    host_blacklist: ['bar.com', 'foo.com', /\.foo\.com$/],
}

isURL('http://foobar.com', options) // => true
isURL('http://foo.bar.com/', options) // => true
isURL('http://qux.com', options) // => true

isURL('http://bar.com/', options) // => false
isURL('http://foo.com/', options) // => false
isURL('http://images.foo.com/', options) // => false
isURL('http://cdn.foo.com/', options) // => false
isURL('http://a.b.c.foo.com/', options) // => false

Mathias Bynens编译了一个带有测试URL的知名URL正则表达式列表。没有什么理由去写一个新的正则表达式;只要选择一个现有的最适合你的。

但是这些正则表达式的比较表也表明，使用单个正则表达式进行URL验证几乎是不可能的。Bynens列出的所有正则表达式都会产生假阳性和假阴性。

我建议您使用现有的URL解析器(例如JavaScript中的新URL('http://www.example.com/'))，然后应用您想要对URL响应的解析和规范化形式执行的检查。它的组件。使用JavaScript URL接口还有一个额外的好处，它只接受浏览器真正接受的URL。

您还应该记住，技术上不正确的url仍然可以工作。例如http://w_w_w.example.com/， http://www..example.com/， http://123.example.com/都有一个无效的主机名部分，但我知道的每个浏览器都会试图打开它们而没有抱怨，当你在/etc/hosts/中为这些无效的名称指定IP地址时，这样的url甚至可以工作，但只在你的计算机上。

因此，问题不在于URL是否有效，而在于在特定的上下文中应该允许哪些URL工作。

如果你想进行URL验证，有很多细节和边缘情况很容易被忽视:

URLs may contain credentials as in http://user:password@www.example.com/. Port numbers must be in the range of 0-65535, but you may still want to exclude the wildcard port 0. Port numbers may have leading zeros as in http://www.example.com:000080/. IPv4 addresses are by no means restricted to 4 decimal integers in the range of 0-255. You can use one to four integers, and they can be decimal, octal or hexadecimal. The URLs https://010.010.000010.010/, https://0x8.0x8.0x0008.0x8/, https://8.8.2056/, https://8.526344/, https://134744072/ are all valid and just creative ways of writing https://8.8.8.8/. Allowing loopback addresses (http://127.0.0.1/), private IP addresses (http://192.168.1.1), link-local addresses (http://169.254.100.200) and so on may have an impact on security or privacy. If, for instance, you allow them as the address of user avatars in a forum, you cause the users' browsers to send unsolicited network requests in their local network and in the internet of things such requests may cause funny and not so funny things to happen in your home. For the same reasons, you may want to discard links to not fully qualified hostnames, in other words hostnames without a dot. But hostnames may always have a trailing dot (like in http://www.stackoverflow.com.). The hostname portion of a link may contain angle brackets for IPv6 addresses as in http://[::1]. IPv6 addresses also have ranges for private networks or link-local addresses etc. If you block certain IPv4 addresses, keep in mind that for example https://127.0.0.1 and https://[::ffff:127.0.0.1] point to the same resource (if the loopback device of your machine is IPv6 ready). The hostname portion of URLs may now contain Unicode, so that the character range [-0-9a-zA-z] is definitely no longer sufficient. Many registries for top-level domains define specific restrictions, for example on the allowed set of Unicode characters. Or they subdivide their namespace (like co.uk and many others). Top-level domains must not contain decimal digits, and the hyphen is not allowed unless for the IDN A-label prefix "xn--". Unicode top-level domains (and their punycode encoding with "xn--") must still contain only letters but who wants to check that in a regex?

应用哪些限制和规则取决于项目需求和喜好。

我最近为一个web应用程序编写了一个URL验证器，它适用于论坛、社交网络等用户提供的URL。你可以把它作为你自己的基础:

(Angular)前端的JavaScript/Typescript版本 Perl版本的后端

我还写了一篇博客文章《URL验证的血淋淋的细节》，提供了更深入的信息。

该功能不允许localhost，只允许web页面的url(即只允许http或https协议)。

它也只允许这里定义的安全字符:https://www.urlencoder.io/learn/

function isValidWebUrl(url) {
   let regEx = /^https?:\/\/(?:www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_\+.~#?&//=]*)$/gm;
   return regEx.test(url);
}