使用JavaScript解码URL参数

Question

这应该是一项简单的任务,但我似乎无法找到解决方案.

我有一个基本字符串作为查询字符串参数传递,如下所示:This+is+a+message+with+spaces.我想使用JavaScript解码该参数This is a message with spaces,但我似乎无法解码它.

我试过decodeURI('This+is+a+message+with+spaces')但结果仍然包含+迹象.

Answer 1

是的,decodeURIComponent函数不会将+转换为空格.所以你必须用替换函数替换+.

理想情况下,以下解决方案有效

var str_name = 'This+is+a+message+with+spaces';
decodeURIComponent((str_name + '').replace(/\+/g, '%20'));

Answer 2

就像它已经指出的那样,decodeURI函数不会转换+为空间,但是有一些值得在这里实现的东西:

• decodeURI是指用于整个URI,也就是说,它并不像解码分隔符?,&,=,+,等.
• decodeURIComponent应该使用解码参数
  (值得一看:decodeURIComponent和decodeURI有什么区别？)
• 您尝试解码的字符串实际上可能包含+编码为%2B,因此您不应+在转换后替换,因为您可能会丢失+您实际需要的迹象,例如something?num=%2B632+905+123+4567应该变为:
  something?num=+632 905 123 4567
  因为您可能要提取数字:+632 905 123 4567

所以正确的方法是:

var str = 'something?num=%2B632+905+123+4567';
decodeURIComponent( str.replace(/\+/g, '%20') );

Answer 3

加号未编码/解码.要查看解码函数的工作原理,您需要先传递编码的URI.看一看:

encodeURI( "http://www.foo.com/bar?foo=foo bar jar" )

将生成:http://www.foo.com/bar?foo=foo%20bar%20jar,即编码的URI.

decodeURI( "http://www.foo.com/bar?foo=foo%20bar%20jar" )

将生成:http://www.foo.com/bar?foo=foo bar jar,即解码的URI.

Answer 4

下面的代码将解码，并以对象的形式为您提供参数

export function getParamsFromUrl(url) {
    url = decodeURI(url);
    if (typeof url === 'string') {
        let params = url.split('?');
        let eachParamsArr = params[1].split('&');
        let obj = {};
        if (eachParamsArr && eachParamsArr.length) {
            eachParamsArr.map(param => {
                let keyValuePair = param.split('=')
                let key = keyValuePair[0];
                let value = keyValuePair[1];
                obj[key] = value;
            })
        }
        return obj;
    }
}