url构造函数是现代浏览器推荐的唯一解析方式,要求完整合法url(含协议和主机)或配合合法base解析相对路径;修改查询参数必须用urlsearchparams;origin不可写且用于同源判断,host可写但静默失败。

直接用 URL 构造函数,别写正则、别用字符串切分——这是现代浏览器原生支持、语义清晰、容错强的唯一推荐方式。
解析任意 URL 字符串(含相对路径)
只要传入合法字符串,URL 就能正确拆解协议、域名、路径、查询参数等。相对路径必须带 base,否则抛 TypeError: Invalid URL。
常见错误是把纯路径(如 /api/users?id=1)直接传给 new URL() 而不提供 base:
- ✅ 正确:
new URL("/api/users?id=1", "https://example.com") - ❌ 报错:
new URL("/api/users?id=1") - ⚠️ 注意:base 本身也必须是合法 URL,
"http://"不行,"http://example.com"才行
安全读取和修改 query 参数用 URLSearchParams
url.searchParams 是只读属性,但返回的对象可直接增删改查,最终自动同步到 url.href。它比手动拼接 ? 和 & 更可靠,天然处理编码问题。
典型误操作是把 searchParams 当成普通对象遍历或赋值:
- ✅ 正确:
url.searchParams.set("page", "2")或url.searchParams.append("sort", "desc") - ❌ 无效:
url.searchParams.page = 2(不会生效) - ⚠️ 注意:
searchParams.get("key")返回null而非undefined,判断时建议用searchParams.has("key")
注意 origin 和 host 的区别
这两个属性看着像,但行为差异直接影响安全逻辑和跨域判断:
-
url.origin返回"https://example.com:8080"这类完整源(协议+主机+端口),不可写,且对data:或blob:URL 返回固定字符串(如"null") -
url.host返回"example.com:8080"(主机+端口),可写,但写入非法值会静默失败 - ⚠️ 关键点:同源检查依赖
origin,而动态构造请求域名时通常用hostname(不含端口)更稳妥
真正容易被忽略的是:URL 对象一旦创建就**冻结了原始字符串的解析上下文**——比如你用 new URL("a/b", "https://x.com/c/d") 得到 https://x.com/a/b,后续再改 pathname 为 "/e/f",结果是 https://x.com/e/f,不是基于 a/b 的相对计算。它的“相对性”只在构造那一刻起作用。
大量免费API接口:立即使用
涵盖生活服务API、金融科技API、企业工商API、等相关的API接口服务。免费API接口可安全、合规地连接上下游,为数据API应用能力赋能!











