提取URL参数问题：获取userid参数返回null求助

你的问题出在URL参数的位置——你要提取的userid是在#（hash片段）之后的，而原生URL.searchParams只能解析#之前、?之后的查询参数，所以直接用它自然拿不到hash里的值。

问题代码分析 #

看你的代码：

location = window.location;
urlHref = location.href;
urlConvert = new URL(this.urlHref); // 这里如果是在类中，应该是urlHref而非this.urlHref，不过这是次要问题
if (location.toString().includes('userid')) {
  this.userId = this.urlConvert.searchParams.get("userid");
  console.log(this.userId);
} else {
  this.userId = 'user';
  console.log('gets user not candidate');
}

urlConvert.searchParams只会读取http://localhost:4200/这部分之后、#之前的参数，但你的userid是在#/candidate/login/?...里面，属于hash的一部分，所以searchParams根本访问不到它。

修正后的代码方案 #

你需要先提取hash片段里的查询参数，有两种简单的方法：

方法1：直接解析hash中的查询字符串

const location = window.location;
// 提取hash部分，去掉开头的#/
const hashPath = location.hash.slice(2);
// 分离出查询参数部分（?后面的内容）
const queryStr = hashPath.split('?')[1] || '';
// 用URLSearchParams解析查询参数
const hashParams = new URLSearchParams(queryStr);

if (hashParams.has('userid')) {
  this.userId = hashParams.get('userid');
  console.log(this.userId); // 现在应该能拿到cb2147ed-bd42-4b9f-82d4-0dcef861e24d
} else {
  this.userId = 'user';
  console.log('gets user not candidate');
}

方法2：构造临时URL解析hash内容

这种方法更优雅，适合hash里的路径和参数结构和标准URL类似的情况：

const location = window.location;
// 构造临时URL，把hash去掉#后的内容作为路径，基于当前域名
const tempUrl = new URL(location.hash.slice(1), location.origin);
const userId = tempUrl.searchParams.get('userid');

if (userId) {
  this.userId = userId;
  console.log(this.userId);
} else {
  this.userId = 'user';
  console.log('gets user not candidate');
}

额外注意点 #

• 如果你是在类组件中，确保变量作用域正确——比如原来的urlHref = location.href;如果是实例属性，才用this.urlHref，否则直接用urlHref即可。
• 可以用hashParams.has('userid')替代location.toString().includes('userid')，这样判断更准确（避免URL其他部分包含userid字符串的误判）。

内容的提问来源于stack exchange，提问作者RRB