如何在 JavaScript 中使用正则表达式验证 URL？

在开发 Web 应用程序时，URL 验证是一项非常重要的任务。JavaScript 中的正则表达式是一种十分强大的工具，可以用于验证 URL。下面介绍如何使用正则表达式验证 URL。

正则表达式

先介绍一下正则表达式。正则表达式是一种字符串匹配模式，可以用于检查一个字符串是否与某种模式匹配。在 JavaScript 中，可以使用 RegExp 类来创建正则表达式。

假设要验证一个 URL 是否合法，可以使用以下正则表达式：

const urlRegex = /^(?:http(s)?:\/\/)?([\w-]+\.)+[\w-]+[.\w-]*?(\/[\w-.\/?%&=]*)?$/;

该正则表达式将会对一个 URL 进行如下验证：

• 是否以 http:// 或 https:// 开头
• 中间部分只能包含字母、数字、横线和点，横线和点不能连续使用
• 后缀部分中只能包含字母、数字、横线和点
• 后缀部分中点后面必须有数字或字母，例如 .com、.org 等
• 如果 URL 包含路径部分，路径部分也必须符合要求

验证 URL

接下来是验证 URL 的代码：

function isValidUrl(url) {
  const urlRegex = /^(?:http(s)?:\/\/)?([\w-]+\.)+[\w-]+[.\w-]*?(\/[\w-.\/?%&=]*)?$/;
  return urlRegex.test(url);
}

调用上述函数，它将返回 true 或 false，表示 URL 是否合法。例如：

isValidUrl('http://www.example.com'); // true
isValidUrl('https://www.example.com/path'); // true
isValidUrl('http://www.example.com#fragment'); // true
isValidUrl('http://www.example.com/?key=value'); // true
isValidUrl('http://www.example.com/path?key=value'); // true
isValidUrl('www.example.com'); // false
isValidUrl('example.com'); // false

总结

通过以上的介绍，我们学习了如何在 JavaScript 中使用正则表达式来验证 URL。正则表达式是一种强大的字符串匹配模式，在任何需要验证字符串时都非常有用。