URL.canParse 是现代浏览器提供的静态方法，用于无异常判断字符串是否可解析为合法 URL，比 new URL() 更轻量安全，适用于用户输入预校验；它支持相对路径解析（需 base 参数），但纯相对路径默认返回 false，且不校验协议安全性。
URL.canParse 是现代浏览器（Chrome 88+、Firefox 91+、Safari 16.4+）提供的静态方法，用于在不抛出异常的前提下判断一个字符串是否能被解析为合法的 URL。相比传统 new URL() 的 try-catch 方式，它更轻量、更安全，特别适合在实例化前对用户输入、配置项或第三方数据做预校验。
为什么不用 new URL() 直接校验？
直接用 new URL(str) 校验存在两个明显问题：
- 非法字符串会立即抛出
TypeError，必须包裹 try-catch，代码冗余且影响可读性； - 即使语法合法，
new URL()也会尝试规范化（如补全协议、处理相对路径），可能掩盖原始意图（例如你只想确认用户是否输入了完整绝对 URL）。
URL.canParse 的基本用法
它接受一个字符串和可选的基准 URL（用于解析相对 URL），返回布尔值：
URL.canParse("https://example.com") → trueURL.canParse("ftp://files.example.org") → trueURL.canParse("not-a-url") → false-
URL.canParse("/path", "https://base.com") → true（相对路径 + base，可解析） -
URL.canParse("/path") → false（无 base 的纯相对路径，无法独立解析）
校验常见外部链接场景的建议
实际业务中，需结合语义目标选择校验策略：
- 只接受绝对 URL（推荐多数情况）：不传第二个参数，避免意外接受相对路径；
-
允许带协议的 HTTP/HTTPS 链接：可额外检查
url.startsWith("http://") || url.startsWith("https://")，因为canParse对mailto:xxx、tel:123也返回 true； -
过滤空格、换行、控制字符：先
.trim()再校验，否则" https://a.com "会返回 false（规范要求 URL 字符串不能首尾含空白）； -
避免误判 data: 或 javascript: 协议：若业务不允许危险协议，需单独用正则或
new URL()提取.protocol进一步过滤。
一个实用的校验封装示例
你可以这样封装一个安全、语义明确的函数：
function isValidHttpUrl(str) {
if (typeof str !== 'string') return false;
const trimmed = str.trim();
if (!trimmed) return false;
if (!URL.canParse(trimmed)) return false;
try {
const url = new URL(trimmed);
return url.protocol === 'http:' || url.protocol === 'https:';
} catch {
return false;
}
}
这个函数兼顾了语法合法性、协议白名单和基础类型防护，适合表单提交或 API 入参校验。
