在线 URL 参数解析器：提取和分析 URL 查询参数

什么是 URL 参数

URL 参数（Query Parameters）是 URL 中 ? 后面的键值对，用于传递附加信息。多个参数用 & 分隔。

URL 结构

https://example.com/search?q=javascript&page=1&lang=zh
|__________ 基础 URL ___________| |______ 查询参数 ______|
                                  ^                      ^
                                  ?                      &

URL 编码

URL 中的特殊字符需要编码，在线 URL 编码器可以一键处理：

• 空格 → %20 或 +
• 中文 → %E4%B8%AD%E6%96%87
• & → %26
• = → %3D

为什么需要 URL 参数解析

1. API 调试：分析 API 请求的查询参数
2. SEO 分析：检查 URL 中的跟踪参数（utm_source 等）
3. 参数提取：从长 URL 中快速提取关键信息
4. URL 清理：移除不需要的参数
5. 重定向分析：分析重定向 URL 中的参数
6. 分享链接：清理 URL 中的追踪参数

常见 URL 参数

如何使用在线工具

使用 ToolVault 工具匣 的 URL 参数解析器：

1. 粘贴完整 URL（须含 http:// 或 https:// 前缀——底层用 new URL()，单独的 ?a=1&b=2 会解析失败）
2. 点击解析，参数拆成可编辑的键值表
3. 增删改参数后，下方实时拼回完整 URL
4. 一键复制结果

若还要看协议、主机、端口、路径、hash，用 URL 解析器（输入即解析，无需点按钮）。

实现注记

解析侧：new URL(urlInput) + URLSearchParams(url.search)，再 forEach 填入表格——重复键会全部保留为多行（不是只留最后一个）。解码遵循 WHATWG 查询语义：hello+world → hello world，%2B → 字面 +。

重建侧：对表格里每个非空 key 调用 searchParams.append，再 toString()。注意：

• URLSearchParams.toString() 按 form-urlencoded 习惯把空格写成 +，而本站 URL 编码器 的 encodeURIComponent 把空格写成 %20——同一语义、两种线上字节，签名比对前必须规范形。
• 表格展示的是已解码可读值；你直接在 value 里写中文、&、空格即可，重建时由 URLSearchParams 负责编码。
• 值本身是另一段 URL（OAuth redirect_uri）时，整段当作一个 value 填入，让工具统一编码一次，避免手拼二次编码。

百分号原理见 URL 编解码指南；中文 %XX 见 中文 URL 编码。

重复键、无值、空串：三种歧义

?tag=a&tag=b——URLSearchParams.get 取最后一个，getAll 取全部；有的后端只保留第一个。框架重追加时差异就炸。?flag（无等号）与 ?flag= 在 WHATWG 里值都是空串，与「键不存在」不同。纪律：文档写明接受哪种表示、重复键返回 400 而非静默选择、三种情况显式测试。本解析器把重复键全部展示——工具存在正是因为歧义真实存在。

编码往返与签名

解析后再编码必须活下来：%2B 解成 +，再经 URLSearchParams 常编回 %2B；裸 + 解成空格再编成 +。签名方案必须在排序键、统一编码后再签，否则往返改字节导致验签失败。解析器的职责是解一次；bug 永远是解了零次或两次。HMAC 场景对照 HMAC 工具；载荷是 JSON 时用 JSON 格式化 先看清结构。

三大参数攻击面

redirect / next / returnUrl 接受站外 URL（开放重定向——对路径白名单校验）；callback / jsonp 反射进脚本上下文（遗留端点上的 XSS）；参数污染穿透内部调用（?role=admin 被转发到信任它的下游）。每个入参在进入 SQL / HTML / URL / 内部 API 的新上下文时都当不可信输入。

代码中的 URL 参数处理

JavaScript

// 解析 URL 参数（重复键用 getAll）
function parseUrlParams(url) {
  const params = new URL(url).searchParams;
  const result = {};
  for (const key of new Set(params.keys())) {
    const all = params.getAll(key);
    result[key] = all.length > 1 ? all : all[0];
  }
  return result;
}

// 构建 URL 参数
function buildUrl(base, params) {
  const url = new URL(base);
  Object.entries(params).forEach(([key, value]) => {
    url.searchParams.set(key, value);
  });
  return url.toString();
}

// 移除追踪参数
function cleanUrl(url) {
  const u = new URL(url);
  ['utm_source', 'utm_medium', 'utm_campaign', 'utm_content', 'utm_term', 'fbclid']
    .forEach(param => u.searchParams.delete(param));
  return u.toString();
}

Python

from urllib.parse import urlparse, parse_qs, urlencode

def parse_url_params(url):
    parsed = urlparse(url)
    return parse_qs(parsed.query)  # 默认保留列表

def build_url(base, params):
    return f"{base}?{urlencode(params)}"

def clean_url(url):
    parsed = urlparse(url)
    params = parse_qs(parsed.query)
    clean_params = {k: v for k, v in params.items()
                   if not k.startswith('utm_') and k != 'fbclid'}
    return f"{parsed.scheme}://{parsed.netloc}{parsed.path}?{urlencode(clean_params, doseq=True)}"

URL 参数安全注意事项

1. 不要在 URL 中传递敏感信息（密码、令牌）——会进历史与日志
2. 代理 / CDN 可能缓存带参 URL
3. 敏感数据改走 POST body
4. 设置合适的 Referer 策略防止参数泄露
5. JWT 若出现在 query，优先改 Header；临时排查可用 JWT 解码（勿把生产令牌贴到不可信环境）

FAQ

为什么 URL 参数会变成乱码？

非 ASCII（如中文）需要百分号编码。编码方式不一致会显示乱码——用 URL 编码器 对照，并统一 UTF-8。

如何在前端获取 URL 参数？

const params = new URLSearchParams(window.location.search);
const q = params.get('q');
const tags = params.getAll('tag'); // 重复键

URL 参数有长度限制吗？

技术上没有统一上限，但浏览器和服务器各有限制（Chrome 约 2MB、Apache 默认约 8190、Nginx 默认约 4096）。建议总长控制在 2048 字符以内。

能不能只粘贴 ?a=1&b=2？

本工具的解析入口是 new URL()，需要 scheme + host。裸查询串请先补成 https://example.com/?a=1&b=2，或在代码里用 new URLSearchParams('a=1&b=2')。

来自 ToolVault 工具匣 的开发手记。相关工具：URL 参数解析、URL 解析器、URL 编解码、Base64、JWT 解码。访问 首页 查看更多开发者工具。