URL 构建器,免费
交互式构建 URL,包含 scheme、host、路径、查询参数和片段。
工作原理
- 选择 scheme 和 host:选择协议(http、https、ftp)并输入目标域名。
- 添加路径和查询参数:输入路径,然后根据需要添加键值对。
- 添加片段(可选):添加指向页面特定部分的锚点或 hash。
- 复制拼装后的 URL:生成的 URL 实时更新。复制它用于代码、营销或测试。
为什么使用 URL 构建器?
手动拼装 URL 容易出错 · 一个缺失的斜杠、未编码的空格或丢失的查询参数都可能破坏深链接、API 调用或重定向。此 URL 构建器确保每个组件都正确放置和编码,每次都能生成有效的 URL。它非常适合创建带追踪的营销链接、开发过程中构建 API 端点、为邮件营销拼装深链接,以及记录 URL 结构。
功能特性
- 多种 scheme:默认支持 http、https 和 ftp。
- 自动编码:参数值中的空格和特殊字符会被正确地 URL 编码。
- 多个查询参数:按需添加任意多的键值对。
- 复制到剪贴板:一键复制完整生成的 URL。
- 实时预览:URL 随输入实时更新,即时看到结果。
常见问题
URL 的各部分是什么?
完整 URL 包括:scheme(https)、host(example.com)、可选端口(:8080)、路径(/api/v1)、查询(?key=value)和片段(#section)。此构建器覆盖每一部分。
它处理特殊字符吗?
会。参数值中的空格、带重音的字母、符号和其他非 ASCII 字符会自动编码,确保生成的 URL 在任何浏览器或 API 客户端中都有效。
URL 参数会影响 SEO 吗?
跟踪参数(如 UTM 标签)通常不会影响自然搜索排名。为避免大量带标签的 URL 并存时的重复内容问题,请确保您的 canonical 标签指向每个页面的干净版本。
URL 的解剖,组件一个一个看
定义网络上每个 URL 的语法存在于 RFC 3986「Uniform Resource Identifier (URI): Generic Syntax」(Berners-Lee, Fielding, Masinter, 2005 年 1 月)。浏览器实际上使用 WHATWG URL Living Standard 中定义的稍微更宽容的变体。两者在组件上一致:
- 方案 ,
https、http、ftp、mailto、data、tel、sms、magnet,加上自定义应用方案(myapp://)。RFC 3986 要求小写;WHATWG 规范化。IANA URI Scheme 注册表有官方注册方案列表。 - 权限 ,
userinfo@host:port。出于安全原因,user:password@嵌入凭证形式已弃用:Chrome 64(2018 年 1 月)阻止 URL 中带有凭证的子资源加载,因为它们使网络钓鱼成为可能。 - 主机 , 域名或 IP 字面量。像
президент.рф这样的国际化域名通过 Punycode(RFC 3492,2003 年 3 月)转换为 ASCII:该示例变为xn--d1abbgf6aiiy.xn--p1ai。浏览器透明地进行显示转换。 - 端口 , 仅在方案非默认时包含。默认值:80(http)、443(https)、21(ftp)、22(ssh)、25(smtp)、5432(postgres)、3306(mysql)、6379(redis)。
- 路径 , 斜杠分隔的段。每个段对 RFC 3986 §3.3 定义的
pchar集合之外的任何内容进行百分号编码。点段.和..具有删除语义(§5.2.4)。 - 查询 , 按约定由
&分隔的键值对,但 RFC 3986 仅称「?后的不透明字符串」。约定在 WHATWGapplication/x-www-form-urlencoded算法中正式化。 - 片段 ,
#之后的所有内容。从不发送到服务器。由单页应用路由器、锚链接和 OAuth 隐式流令牌使用。
百分比编码:+ 与 %20 的陷阱
RFC 3986 §2.3 定义了 非保留字符,永远不需要编码:A-Z a-z 0-9 - . _ ~。其他所有内容,当作为 URL 组件内的数据出现时,变为 %XX,其中 XX 是字节的十六进制值。多字节 UTF-8 字符扩展为多个百分号三元组:é(U+00E9,UTF-8 C3 A9)编码为 %C3%A9。经典陷阱是空格字符:在 常规 URL 路径或片段中,空格编码为 %20;在 表单编码的查询字符串中(由 HTML 表单和 WHATWG 查询字符串序列化器共享的 application/x-www-form-urlencoded 算法),空格编码为 +。解码表单数据的服务器将 + 转换回空格;将查询视为通用 URI 的服务器则不会。混合两种约定会无声地破坏数据。JavaScript 中的安全模式:使用 new URLSearchParams 处理查询和 encodeURIComponent 处理单个值;为您处理规范合规性。
您实际需要 URL 构建器的地方
- 为 Google Analytics 添加 UTM 标记的营销链接(Urchin Tracking Module,自 2005 年起在 GA 中):五个规范参数为
utm_source、utm_medium、utm_campaign、utm_content、utm_term,根据 Google 自己的指南全部为小写。 - OAuth 2.0 授权请求(RFC 6749,2012 年 10 月):规范要求
response_type、client_id、redirect_uri、scope、state作为授权端点上的查询参数。 - 移动深度链接:操作系统路由到您已安装应用而非浏览器的
app://方案,或从您的域名提供的 Android App Link / iOS Universal Link。 - API 客户端测试:
https://api.example.com/v2/users?expand=projects&since=2024-01-01。手工键入这些总是在「值中的空格」步骤失败。 - CDN 缓存破坏器:
?v=2026-05-12-1附加到静态资产 URL,以便部署使缓存版本失效。查询字符串是缓存键的一部分。 - 图像变换服务(Cloudinary、imgix、Cloudflare Images):变换编码为查询参数或路径段。典型调用看起来像
?w=800&q=85&fm=webp。 - 电子邮件模板,其中着陆页通过 JS 读取参数,通常将 UTM 标签与唯一
token或uid组合,用于按收件人跟踪。
常见错误
- 忘记在值内对
&进行编码。朴素地将值「猫 & 狗」放入?物种=猫 & 狗会变成键物种值猫加一个迷路的空键。始终通过encodeURIComponent传递。 - 双重编码。对已编码的字符串调用
encodeURIComponent将%20变为%2520。当值通过两个各自「防御性编码」的系统时容易发生。 - 尾随斜杠不匹配。RFC 3986 表示
https://example.com/api和https://example.com/api/是不同的资源。大多数 REST API 将它们视为相同,但有些返回 308 重定向;选择一种规范形式并记录它。 - 混合
+和%20。表单编码的查询字符串使用+表示空格;通用百分比编码使用%20。带有字面量+的路径在复制粘贴中存活,但在表单解码器读取时失败。 - 嵌入凭证。
https://user:pass@example.com已弃用,在 Chrome 64+ 中阻止子资源加载。使用Authorization标头。 - IDN 欺骗。西里尔字母「а」(U+0430) 在视觉上与拉丁字母「a」相同。浏览器在域名混合脚本时显示 Punycode,但手动构造的指向
аpple.com(西里尔字母 а)的 URL 打开的网站与apple.com不同。为了安全使用 Punycode(xn--...),或坚持使用 ASCII。 - 在不使用
//的方案后添加//。mailto:、tel:、sms:、magnet:都跳过//并直接到路径。mailto:user@example.com是正确的;mailto://...不是。
更多常见问题
URL 的最大长度是多少?
RFC 3986 没有设置限制。在实践中:浏览器对地址栏的限制约为 2,000 个字符(Internet Explorer 11 是 2,083;Chrome 和 Firefox 容忍更长但会截断显示);大多数 CDN 和代理限制为 4,096 或 8,192;Apache 和 Nginx 等服务器的默认值为 8,192 字节用于请求行。如果您需要超过 2,000 个字符,请切换到 POST 主体。
我可以多次包含相同的查询参数吗?
可以。?tag=red&tag=blue&tag=green 是有效的。服务器如何解释取决于框架:Express / Node.js 解析为 req.query.tag = ['red', 'blue', 'green'];PHP 需要方括号约定 ?tag[]=red&tag[]=blue;如果使用 tag[] 方括号,Rails 解析为数组。无论方括号样式如何,URLSearchParams.getAll('tag') 方法始终将所有值作为数组返回。
查询参数会影响 SEO 吗?
跟踪参数(UTM、fbclid、gclid)通常不影响有机搜索排名。风险是 重复内容索引:带标签的 URL 和它的干净版本对爬虫来说看起来像两个不同的页面。修复是使用 <link rel="canonical" href="clean-url"> 标签将每个带标签的变体指向相同的规范 URL。
什么是 URI 模板,我应该使用吗?
RFC 6570(2012 年 3 月)定义 URI 模板:带占位符的参数化 URL 的语法。它们在 OpenAPI / Swagger 规范、JSON Hyper-Schema 和某些 HATEOAS API 中使用。对于日常的 URL 构建,通过此构建器的简单字符串连接更简单;URI 模板在记录 API 表面和生成客户端 SDK 时表现出色。
是否有任何东西发送到服务器?
没有。您输入的每个组件、编码和最终 URL 都在浏览器的 JavaScript 中构建。不会进行任何网络调用来组装 URL。打开 DevTools 中的网络选项卡并试用工具:您将在构建期间看到零个出站请求。