将 URL 中括号中的字符串转换为查询参数：Javascript

Question

我想将搜索 URL 中 {} 中的字符串转换为查询参数，这将帮助用户在网络分析工具中捕获搜索词。

这就是我想要做的，让我们说

搜索网址是：

example.com/search/newyork-gyms?dev=desktop&id=1220391131

用户输入将是：

var search_url_format = '/search/{city}-{service}

输出网址：

example.com/search?city=newyork&service=gyms&dev=desktop&id=1220391131

问题是什么时候使用正则表达式{(.*)}它会捕获整个字符串{city}-{service}。

但我想要的是[{city},{service}]。

网址格式也可以像

搜索/{城市}/{服务}/

搜索/{城市}_{服务}/

我尝试的是单个变量。

它返回正确的输出。

例如：URL:/search/newyork

用户输入：/search/{city}

输出：/search/newyork?city=newyork

网址：/search-germany

用户输入：/search-{country}

输出：/search-germany?country=germany

var search_url_format = '/search/{city}' //User Enters any variable in brackets
var urloutput = '/search/newyork' //Demo URL

//Log output

console.log(URL2Query(search_url_format)) //Output: '/search/newyork?city=newyork'

function URL2Query(url) {
  var variableReg = new RegExp(/{(.*)}/)
  var string_url = variableReg.exec(url)

  var variable1 = string_url[0]


  //Capture the variable 
  var reg = new RegExp(url.replace(variable1, '([^\?|\/|&]+)'))
  var search_string = reg.exec(urloutput)[1]


  if (location.search.length > 0) // if no query parameters
  {
    return urloutput + "?" + string_url[1] + "=" + search_string
  } else {
    return urloutput + "&" + string_url[1] + "=" + search_string

  }
}

Answer 1

您缺少两件事： 括号匹配组，您使用 .* ，其中包括“{”符号。 所以可以像这样使用 match 而不是 exec：

var search_url_format = '/search/{city}-{service}' //User Enters any    
var variableReg = new RegExp(/({\w+})/g)
var string_url = url.match(variableReg); // [{city}, {service}]

Answer 2

您可能会假设您的“变量”将是字母数字而不是任何字符。在这个假设下，“{”、“-”、“_”等将是标点符号。

所以你的分组正则表达式可以是/({\w+})/g。

//example 
const r = /({\w+})/g;
let variable;
const url = '/search/{city}-{service}';
while ((variable = r.exec(url)) !== null) {
 let msg = 'Found ' + variable[0] + '. ';
 msg += 'Next match starts at ' + r.lastIndex;
 console.log(msg);
}