JS正则提取URL中斜杠之间的值？

Question

大佬们，如何用js正则匹配，得出每个“/”中间的值

let pattern = "{note}/:pakid:/corrinsdetail/{corrInsAleid}/{corrInsPakId}/{corrInsInsta}/{corrInsVernr}/{verFrom}/{verTo}/{name}/:tab:";
let url = "0001668882/41/corrinsdetail/0001023444/41/0020751259/0005/756/756/SAP_BASIS/ValidityDetails";

输入上述数据，期望得到结果

{
  note: "0001668882",
  pakid: "41",
  corrInsAleid: "0001023444",
  corrInsPakId: "41",
  corrInsInsta: "0020751259",
  corrInsVernr: "0005",
  verFrom: "756",
  verTo: "756",
  name: "SAP_BASIS",
  tab: "ValidityDetails"
}

Answer 1

代码
代码显得有点长，为了兼容异常情况，

1. 检验url是否符合pattern，
2. url如果含有参数 ?zz=23423 或者 #abc，需要清洗

3. url中如果含有-也要兼容，不仅仅是_和数字、字母

   let pattern = "{note}/:pakid:/corrinsdetail/{corrInsAleid}/{corrInsPakId}/{corrInsInsta}/{corrInsVernr}/{verFrom}/{verTo}/{name}/:tab:";
   let url = "0001668882/41/corrinsdetail/0001023444/41/0020751259/0005/756/756/SAP_BASIS/ValidityDetails";
   
   
   function extractInfo(pattern, url) {
    const urlRegex = new RegExp(pattern.replace(/(\{|:)[\w-]+(\}|:)/g, "\[\\w-]+").replace(/\//g, "\/"));
    if(!urlRegex.test(url)) {
        throw new Error("输入的Url不符合Pattern");
    }
    let keys = pattern.split("/");
    let values = url.replace(/(\?|#).*/, "").split("/");
    let result = {};
    keys.forEach((v,i)=>{
        if(/(\{|:)\w+(\}|:)/.test(v)) {
            result[v.replace(/(\{|:|\})/g,"")] = values[i];
        }
    })
    return result;
   }
   
   console.log(extractInfo(pattern, url));

   
   

输出结果

Answer 2

简单写了下，不太清楚你的具体的逻辑，供你参考

let pattern = "{note}/:pakid:/corrinsdetail/{corrInsAleid}/{corrInsPakId}/{corrInsInsta}/{corrInsVernr}/{verFrom}/{verTo}/{name}:tab:";
let url = "0001668882/41/corrinsdetail/0001023444/41/0020751259/0005/756/756/SAP_BASIS/ValidityDetails";
let obj = {}
// note = “0001668882”
// pakid = “41”
pattern.split("/").forEach((item, index) => {
    if (item.indexOf("{") !== -1) {
        let key = item.replace("{", "").replace("}", "");
        obj[key] = url.split("/")[index];
    }
    if (item.indexOf(":") !== -1) {
      let key = item.replace(":", "").replace(":", "");
      obj[key] = url.split("/")[index];
  }
});
console.log(obj);

Answer 3

URL Pattern API

const pattern = '{note}/:pakid:/corrinsdetail/{corrInsAleid}/{corrInsPakId}/{corrInsInsta}/{corrInsVernr}/{verFrom}/{verTo}/{name}/:tab:',
    url = '0001668882/41/corrinsdetail/0001023444/41/0020751259/0005/756/756/SAP_BASIS/ValidityDetails'

const parsedPattern = pattern
        .replaceAll(/:(\w+):/g, (_, p) => `:${p}`)
        .replaceAll(/\{(\w+)\}/g, (_, p) => `:${p}`),
    urlPattern = new URLPattern({ pathname: parsedPattern })

console.log(urlPattern.exec({ pathname: url })?.pathname.groups)

结果：

{
  note: "0001668882",
  pakid: "41",
  corrInsAleid: "0001023444",
  corrInsPakId: "41",
  corrInsInsta: "0020751259",
  corrInsVernr: "0005",
  verFrom: "756",
  verTo: "756",
  name: "SAP_BASIS",
  tab: "ValidityDetails"
}

---

注意：你的 pattern 是 .../{verTo}/{name}:tab:，我觉得应该少了一个 /，我这里的 pattern 是 .../{verTo}/{name}/:tab:

Answer 4

你说的是这个意思？

'Alice 14'.match(/(?<name>\w+)\s(?<age>\d+)/)

Answer 5

在JavaScript中，可以使用正则表达式来提取URL中斜杠（/）之间的值。以下是一个简单的例子，展示了如何提取URL路径中的各个部分：

const url = "http://www.xxx.com/path1/path2/file?query=param";
const pathMatch = url.match(//(.*?)//);

if (pathMatch && pathMatch.length > 1) {
const pathParts = pathMatch[1].split('/'); // 这里会得到一个数组，包含斜杠之间的所有值
console.log(pathParts); // 输出: ["", "path1", "path2", "file"]
}

在这个例子中，我们使用了match方法和正则表达式//(.*?)//：

\/：匹配斜杠字符，因为斜杠在正则表达式中是一个特殊字符，表示转义，所以需要使用反斜杠\进行转义。
(.*?)：这是一个非贪婪匹配，它会匹配尽可能少的字符，直到遇到下一个斜杠。括号()表示捕获组，用于提取匹配的文本。
\/：再次匹配斜杠字符。

match方法返回一个数组，其中第一个元素是整个匹配的字符串，第二个元素是第一个捕获组的内容，以此类推。在这个例子中，我们只关心捕获组的内容，所以我们使用matchPath[1]来获取它。

然后，我们使用split('/')方法将捕获组的内容按照斜杠分割成数组，这样就可以得到URL路径中各个部分的值。

注意一下，这个正则表达式只匹配URL中的第一部分路径，如果你想要匹配整个URL中的所有路径部分，你可能需要调整正则表达式或者使用其他方法。以上供参考。