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

相关推荐
冒险的豆子4 分钟前
Proxy & Vue 响应式(合并精简版,适合面试)
前端·javascript·vue.js
Java后端的Ai之路29 分钟前
前端技术Vue-18-视图中的渲染
前端·javascript·vue.js
程序员海军7 小时前
用了两年多 GPT,我最近开始换模型了,还折腾了个求职避坑 Agent
前端·人工智能·后端
zttbee7 小时前
echarts图表tooltip色块失效
前端·javascript·echarts
excel9 小时前
IndexNow:让搜索引擎更快发现网站更新的主动通知协议
前端·后端·架构
Json____9 小时前
用 FastAPI + Vue3 打造一套完整的在线考试系统:从组卷到阅卷的业务闭环实践
后端·node.js·fastapi·it学习·wwwoop.com
子兮曰9 小时前
CSS 复现 23 种设计风格:从拟物到液态玻璃的成本阶梯与兜底写法【实战】
前端·css·视觉设计
虚无境9 小时前
如何用AI帮我写出实用的插件
前端·javascript·ai编程
柳杉10 小时前
从数字化到数智化:3D 可视化大屏的下一个五年
前端·ai编程·数据可视化
zimoyin11 小时前
在 C# 里嵌入 JavaScript:用 Jint 做可热更新的自动化脚本(从入门到踩坑)
javascript·c#·自动化