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

Question

I want to convert the string in {} in search URL to query parameters which would help users capture search terms in web analytics tools.

Here's what I am trying to do, Let's say

Search URL is:

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

User Input will be:

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

Output URL:

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

The problem is when is use the regex {(.*)} it captures the whole string {city}-{service} .

But I what I want is [{city},{service}] .

The URL format can also be like

search/{city}/{service}/

search/{city}_{service}/

What I have tried is for a single variable.

It returns correct output.

Eg: URL:/search/newyork

User Input: /search/{city}

Output: /search/newyork?city=newyork

URL: /search-germany

User Input: /search-{country}

Output: /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

You can probably assume your "variable" will be alphanumeric instead of any character. With this assumption "{", "-", "_" etc will be punctuation.

so your grouping regexp could be /({\\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);
}

Answer 2

You are missing two things: parenthesis to match groups and you use .* which includes "{" sign. So can use match instead of exec like this:

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