# URL解析器使用教程：一键拆解协议、域名、端口与查询参数

> 来源：工具派（https://gjupai.com） 原文页面：https://gjupai.com/tutorial/url-parser-guide

## 工具简介

**URL 解析器**是一个免费在线工具，能把一条完整的 URL 瞬间拆解成各个组成部分：协议、来源（origin）、用户名、密码、主机、主机名、端口、路径、查询字符串和哈希（锚点）。它还会把查询参数逐个拆成「参数名 / 参数值」表格，支持一键查看 URL 解码后的真实值、按键排序生成**归一化查询字符串**，并提供文本、JSON、归一化 URL 三种复制方式。

整个解析在你输入的同时实时完成，无需等待，也不用安装任何软件。

## 适用场景

- **前端/后端开发调试**：快速确认接口地址里的路径、查询参数、端口是否正确。
- **排查跳转问题**：检查带认证信息（`user:pass@`）或哈希锚点的复杂 URL 结构。
- **还原编码参数**：把 `%E5%B7%A5%E5%85%B7` 这类 URL 编码值一键解码成中文。
- **生成规范化链接**：利用「归一化查询字符串」得到按键排序、统一编码的查询串，方便做缓存键、签名或对比。
- **学习与教学**：直观理解 URL 的标准结构（protocol / host / pathname / search / hash）。

## 使用步骤

1. 打开 URL 解析器页面，在标有 **URL** 的输入框中粘贴或输入完整网址（也可以点击下方「示例：」中的任意一条示例链接快速体验）。

2. 输入的同时工具会实时解析，你也可以点击输入框右侧的 **解析** 按钮手动触发；如果输入不合法，会提示「请输入合法的 URL，例如 https://example.com」。

![URL 解析器主界面：输入框中已粘贴一条带认证信息和查询参数的完整 URL，下方展示出协议、来源、主机、端口、路径等各字](article/202607/1783947982256_3548.png)

3. 在解析结果区查看各字段卡片：完整 URL（href）、协议（protocol）、来源（origin）、用户名（username）、密码（password）、主机（host）、主机名（hostname）、端口（port）、路径（pathname）、查询字符串（search）、哈希（hash）。每个有内容的字段右侧都有 **复制** 按钮；密码默认显示为 `••••••`，点 **复制密码** 可复制真实值。

![查询参数表格区域：列出参数名/参数值/操作三列，右上角有'显示解码后的值'勾选框，以及密码字段的打码显示与'复制密码'按](article/202607/1783947982496_1694.png)

4. 查看下方 **查询参数** 表格（参数名 / 参数值 / 操作）。默认勾选 **显示解码后的值**，表格展示解码后的中文/特殊字符；取消勾选则显示原始编码值。每行右侧的 **复制** 会复制 `参数名=参数值`。

5. 如查询参数较多，可在底部查看 **归一化查询字符串（参数按键排序、URL 编码）**，点击 **复制** 获取；也可以直接用 **复制完整解析结果（文本）**、**复制完整解析结果（JSON）** 或 **复制归一化 URL** 一键导出。

![结果导出区域：'复制完整解析结果（文本）''复制完整解析结果（JSON）''复制归一化 URL'三个按钮，以及底部归一化](article/202607/1783947982700_45.png)

6. 需要解析下一个网址时，点击 **清空** 按钮重置输入框和结果。

## 参数与选项说明

| 参数/选项 | 说明 | 默认值/可选值 |
| --- | --- | --- |
| URL 输入框 | 待解析的完整网址，需包含协议（如 `https://`） | 占位提示「请输入完整 URL」 |
| 解析 按钮 | 手动触发解析（输入时也会自动实时解析） | — |
| 清空 按钮 | 清空输入框与全部解析结果 | — |
| 示例 链接 | 预置 3 条示例 URL，点击即解析 | 含认证信息示例、工具派工具页、Google 搜索链接 |
| 显示解码后的值 | 勾选后查询参数表格显示 `decodeURIComponent` 解码后的值；取消则显示原始编码值 | 默认勾选 |
| 复制完整解析结果（文本） | 以「字段: 值」纯文本形式复制全部解析结果与查询参数 | — |
| 复制完整解析结果（JSON） | 以格式化 JSON 复制全部字段及参数（含原始值与解码值） | — |
| 复制归一化 URL | 复制由解析结果重建、查询参数按键排序并重新 URL 编码后的规范链接 | — |

## 实用技巧

- **输入即解析**：不需要点按钮，粘贴 URL 的瞬间结果就出来了，批量核对链接时效率很高。
- **善用归一化功能**：做接口签名、缓存键或日志对比时，参数顺序不同会导致不匹配，「归一化查询字符串」会按参数名排序并统一编码，复制归一化 URL 可消除这类差异。
- **host 与 hostname 的区别**：`host` 包含端口（如 `example.com:8080`），`hostname` 不含端口，写代码取值时别混用。
- **密码安全**：URL 中的密码字段默认打码显示，需要时再点「复制密码」，避免截图或投屏时泄露。
- **无值字段**：没有端口、查询字符串或哈希时，对应卡片会显示「（默认）」或「（无）」，这是正常表现。

## 常见问题

**Q：为什么提示「请输入合法的 URL」？**
A：解析基于浏览器标准的 `URL` 对象，必须包含协议头。例如要输入 `https://example.com`，只写 `example.com` 会报错，补上 `https://` 即可。

**Q：端口显示「（默认）」是什么意思？**
A：当 URL 使用协议的默认端口（HTTP 为 80、HTTPS 为 443）或未显式写端口时，解析结果的端口字段就显示「（默认）」，表示走默认端口。

**Q：查询参数里的 `%XX` 乱码是什么？**
A：那是 URL 编码（百分号编码），用于在链接中安全传输中文和特殊字符。保持「显示解码后的值」勾选即可看到解码后的原文。

**Q：归一化 URL 和原 URL 有什么区别？**
A：归一化 URL 由解析出的各部分重新拼接而成，查询参数会按参数名排序并统一做 URL 编码，参数内容不变，但顺序和编码风格一致，便于对比和签名。

**Q：解析过程会把我的 URL 上传到服务器吗？**
A：不会。解析完全在你的浏览器本地通过 JavaScript 完成，适合处理包含认证信息等敏感内容的链接。