如何从Cookie字符串中提取XSRF-TOKEN值并完成URL解码

方案1：字符串分割实现（兼容性好、易理解） #

直接通过字符串分割筛选目标cookie项，逻辑清晰，兼容所有JS运行环境：

// 示例cookie值（实际使用时替换为你的动态返回值）
var csrfCookie = "XSRF-TOKEN=eyJpdiI6ImtBWXVqS0RmRzN5Z241UUVibXc4M1E9PSIsInZhbHVlIjoiMDJZYWNtUk5MOUxPZzA4d1JVMU5Ldks0R2VoWUhjMGNDREpXT1FrQjVqeHhRQ0FRQWtKUW1sTFY3MlRCVlhKS3kwczlOM2FKSWNXL3pNS0RCa3lvc3cxb0p5TGlSeXdDcjRMOFh5bytHakJmcU45S0JuT2pxOXdxSlY1WXdpQnQiLCJtYWMiOiI0OTlkNjgyNWNlMTJmZGJiMWM0ZWNmYzJmNTE3NGM5OTc5MjA3ZWQ2ODg2MDIyYmM4N2FiNTljMDQzYzQxYzBkIn0%3D; expires=Sun, 26-Sep-2021 10:15:25 GMT; Max-Age=7200; path=/; domain=.somedomain.site";

function getDecodedXsrfToken(cookieStr) {
  // 按分隔符拆分所有cookie属性
  const cookieList = cookieStr.split('; ');
  // 筛选XSRF-TOKEN对应的项
  const targetItem = cookieList.find(item => item.startsWith('XSRF-TOKEN='));
  // 无匹配时返回null
  if (!targetItem) return null;
  // 截取前缀后的值并做URL解码
  return decodeURIComponent(targetItem.replace('XSRF-TOKEN=', ''));
}

// 调用获取结果
const result = getDecodedXsrfToken(csrfCookie);
console.log(result);

方案2：正则匹配实现（代码更简洁） #

通过正则直接捕获token值，适合追求精简代码的场景：

var csrfCookie = "XSRF-TOKEN=eyJpdiI6ImtBWXVqS0RmRzN5Z241UUVibXc4M1E9PSIsInZhbHVlIjoiMDJZYWNtUk5MOUxPZzA4d1JVMU5Ldks0R2VoWUhjMGNDREpXT1FrQjVqeHhRQ0FRQWtKUW1sTFY3MlRCVlhKS3kwczlOM2FKSWNXL3pNS0RCa3lvc3cxb0p5TGlSeXdDcjRMOFh5bytHakJmcU45S0JuT2pxOXdxSlY1WXdpQnQiLCJtYWMiOiI0OTlkNjgyNWNlMTJmZGJiMWM0ZWNmYzJmNTE3NGM5OTc5MjA3ZWQ2ODg2MDIyYmM4N2FiNTljMDQzYzQxYzBkIn0%3D; expires=Sun, 26-Sep-2021 10:15:25 GMT; Max-Age=7200; path=/; domain=.somedomain.site";

// 正则匹配XSRF-TOKEN的值
const tokenMatch = csrfCookie.match(/XSRF-TOKEN=([^;]+)/);
const result = tokenMatch ? decodeURIComponent(tokenMatch[1]) : null;
console.log(result);

注意事项 #

• 两种方案都会自动处理动态变化的cookie后缀，不需要手动写死过期时间、domain等冗余内容的截取规则
• 内置decodeURIComponent方法会自动处理%3D这类URL编码字符，不需要额外引入依赖

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