javascript - 正则表达式 URL(过滤器)解密

Question

我正在尝试为视频列表构建过滤器。我设法编写了一个字符串，其中包含用户选择用于过滤的所有值。此时，我通过 URL 将此字符串作为参数发送。

示例:http://example.dev/admin#/videos/status:3&site:4&categories:15,2,3&actors:33,5,36&search:Grass%20hopper%20/

注意:请注意，用户可能会选择较少的过滤器，因此参数:status:3&site:4&categories:15,2,3&actors:33,5,36&search:Grass%20hopper%20，可能不同，但上面的例子是最大组合。

问题:如何使用正则表达式 (JS) 获取所有数据？

首选结果:['status=3', 'site=4', 'categories=15,2,3', 'actors=33,5,3', 'search=Grass hopper']。

到目前为止，我已经把这个:(\w+):(((\d+),)*(\d+)|(\d+))&*，但我真的不知道该放什么做出来。

提前谢谢你。

Answer 1

您只能将带有可选逗号的数字与您的正则表达式匹配，而不是像 Grass hopper 这样的值。

您可以匹配 last /.../ 中的键值，其中最右边的 / 位于字符串的末尾(如果它可以不存在，则应在其后添加一个 ? 量词)。

使用

\w+:(?!\/\/)[^&]+(?=[^\/]*\/$)

参见 regex demo .

解释:

• \w+: - 1+ 个字母数字或下划线后跟 :
• (?!\/\/)[^&]+ - 除了 & 但不是以 // 开头的 1+ 个字符(避免匹配 http://)
• (?=[^\/]*\/$) - 检查我们是否在最后一个 /.../ 中的正面前瞻。

var re = /\w+:(?!\/\/)[^&]+(?=[^\/]*\/$)/g; 
var str = 'http://example.dev/admin#/videos/status:3&site:4&categories:15,2,3&actors:33,5,36&search:Grass hopper /';
var res= str.match(re);
if (res) {
  res = res.map(function (x) {return x.replace(":", "=")});
  document.body.innerHTML = "<pre>" + JSON.stringify(res, 0, 4) + "</pre>";
}

另一种解决方案是使用正则表达式只获取 video/ ( demo )

之后的 URL 部分

videos\/([^\/]+)

然后用&分割match[1]:

var re = /videos\/([^\/]+)/; 
var str = 'http://example.dev/admin#/videos/status:3&site:4&categories:15,2,3&actors:33,5,36&search:Grass hopper /';
var m = str.match(re);
var res = [];
if (m) {
  res = m[1].split("&");
  res = res.map(x => x.replace(":", "="));
  document.body.innerHTML = "<pre>" + JSON.stringify(res, 0, 4) + "</pre>";
}