本文讲解在url中存在重定向链接（作为查询参数）时，如何准确提取其完整值，避免因未编码导致的参数截断问题，并提供安全可靠的解析方案。
本文讲解在url中存在重定向链接（作为查询参数）时，如何准确提取其完整值，避免因未编码导致的参数截断问题，并提供安全可靠的解析方案。
在Web开发中，常需通过URL传递重定向地址（如 ru、redirect_uri 等），而该地址本身可能携带自己的查询参数（例如 https://example.com?next=/home&ref=abc）。若未对重定向URL进行URI编码，直接拼接进主URL，会导致浏览器或JavaScript解析器将嵌套参数误判为主URL的一部分，从而截断参数值。
例如，以下URL是错误构造的：
https://test.domain.com?param1=a&ru=https://url2.domain.com/?url2paramA=A&url2paramB=B
此处 url2paramB=B 被解析为顶级查询参数，而非 ru 的一部分，因此调用 getParameterByName('ru', url) 仅返回：
https://url2.domain.com/?url2paramA=A
——&url2paramB=B 被错误剥离。
✅ 正确做法：在构造URL时，对重定向URL进行 encodeURIComponent() 编码：
const redirectUrl = 'https://url2.domain.com/?url2paramA=A&url2paramB=B';
const baseUrl = 'https://test.domain.com';
const fullUrl = `${baseUrl}?param1=a&ru=${encodeURIComponent(redirectUrl)}`;
console.log(fullUrl);
// 输出：
// https://test.domain.com?param1=a&ru=https%3A%2F%2Furl2.domain.com%2F%3Furl2paramA%3DA%26url2paramB%3DB
此时再使用健壮的参数提取函数（推荐使用现代 URLSearchParams API，更可靠）：
function getQueryParam(name, url) {
try {
const urlObj = new URL(url);
return urlObj.searchParams.get(name);
} catch (e) {
console.error('Invalid URL:', e);
return null;
}
}
const result = getQueryParam('ru', fullUrl);
console.log(decodeURIComponent(result));
// 输出：
// https://url2.domain.com/?url2paramA=A&url2paramB=B
⚠️ 注意事项：
- 永远不要手动拼接未编码的URL作为查询参数值；
- 避免正则解析（如原 getParameterByName），因其无法正确处理编码字符、特殊符号及边缘情况；
- URLSearchParams 是标准、安全、可读性强的首选方案，兼容所有现代浏览器（IE除外，如需支持请引入 polyfill）；
- 若必须使用正则（如环境受限），需确保匹配逻辑能处理 %xx 编码字符，但复杂度高、易出错，不推荐。
总结：URL 中的查询参数值若本身是 URL，必须经过 encodeURIComponent() 编码；解析时优先采用 new URL().searchParams，兼顾准确性、可维护性与安全性。
