JavaScipt验证URL新方法(2023 年版)

JavaScript诞生以来,一直没有一种简单的方法验证URL,现在JavaScript新增了一个新方法------URL.canParse

jsx 复制代码
URL.canParse('https://www.stefanjudis.com'); // true 
URL.canParse('www.stefanjudis.com'); // false

URL.canParse() 是一种快速验证字符串是否为有效的URL的方法。然而我们也不要高兴太早,URL.canParse()方法还存在浏览器兼容问题,在写这篇文章时支持该方法的浏览器版本如下图:

这是详情的浏览器支持信息链接:caniuse.com/?search=can...

不过core-js已支持URL.canParse()方法,使用core-js作为垫片可以解决浏览器兼容性问题。

URL.canParse()URL() 构造函数是相同的算法来评估有效的 URL。

由于这两种方法都实现了相同的解析器,并且URL() 目前得到了很好的支持,因此我们可以使用构造函数来验证 URL。将新的URL() 放在辅助函数中,调用它并检查它是否抛出异常!

jsx 复制代码
function isUrlValid(string) {
  try {
    new URL(string);
    return true;
  } catch (err) {
    return false;
  }
}

isUrlValid('https://www.stefanjudis.com'); // true
isUrlValid('www.stefanjudis.com'); // false

如果不喜欢 isUrlValid 函数,也可以像 core-js 一样 polyfill URL.canParse()

关注公粽号【程序员凌览】回复"666",拉您进【人类高质量前端交流群~】

往期推荐:linglan01.cn/about

相关推荐
0***R5153 分钟前
前端云原生
前端·云原生
D***y20111 分钟前
使用Node.js搭配express框架快速构建后端业务接口模块Demo
node.js·express
疯狂踩坑人14 分钟前
MCP理论和实战,然后做个MCP脚手架吧
前端·node.js·mcp
中杯可乐多加冰19 分钟前
基于 DeepSeek + MateChat 的证券智能投顾技术实践:打造金融领域的专属大Q模型助手
前端·人工智能
凡人程序员19 分钟前
搭建简易版monorepo + turborepo
前端·javascript
丸子哥哥19 分钟前
同一个域名,如何添加多个网站?
服务器·前端·nginx·微服务
不努力也不会混19 分钟前
vite联邦实现微前端(vite-plugin-federation)
前端·vue.js
伍亿伍千万21 分钟前
Uptime Kuma修改作为内嵌页面的自适应
前端
Heo23 分钟前
原来Webpack在大厂中这样进行性能优化!
前端·javascript·vue.js
涔溪24 分钟前
Vue2 项目中通过封装 axios 来同时连接两个不同的后端服务器
前端·vue.js·axios