How to encode a query string so that it is the value of another query string in javascript?

JavascriptEncodingQuery String

Javascript Problem Overview


I have a javascript function which passes as a query string value another query string.

In other words, I want the query string to be:

http://www.somesite.com/?somequery=%3fkey%3dvalue1%2520%26%2520key2%3value3

However, if I redirect like this:

var url = 'http://www.somesite.com/?somequery=';
url += escape('?key=value1&key2=value2');
window.location = url;

it ends up as http://www.somesite.com?somequery=?key1=value1&key2=value2 in firefox and IE7 which means that I can't parse the query string correctly.

I also tried using encodeURIComponent which didn't work either.

Is there another function or a hack to force the redirect to keep the somequery value escaped??

Javascript Solutions


Solution 1 - Javascript

encodeURIComponent will work. (You may or may not want the leading ‘?’, depending on what the script is expecting.)

var c= 'd e'
var query= '?a=b&c='+encodeURIComponent(c);
var uri= 'http://www.example.com/script?query='+encodeURIComponent(query);
window.location= uri;

Takes me to:

> http://www.example.com/script?query=%3Fa%3Db%26c%3Dd%2520e

When you hover over that it may appear once-decoded in the browser's status bar, but you will end up in the right place.

escape/unescape() is the wrong thing for encoding query parameters, it gets Unicode characters and pluses wrong. There is almost never a case where escape() is what you really need.

Solution 2 - Javascript

Native escape method does that. but also you can create a custom encoder like:

function encodeUriSegment(val) {
  return encodeUriQuery(val, true).
             replace(/%26/gi, '&').
             replace(/%3D/gi, '=').
             replace(/%2B/gi, '+');
}

this will replace keys used in query strings. further more you can apply it to any other custom encodings by adding needed key-values pairs.

Solution 3 - Javascript

function downloadFile(){
      var filePath = "C:/Users/HP/Desktop/Project Folder/DemoProject/";

      var fileInfo = "Error_Issue Minor Cosmetic & Major Fatal Issues (Demo_Project) (2017)_GeneratedOn_12_21_2017 21924 AM.xlsx";
      if((filePath != undefined && filePath.length > 0) && (fileName != undefined && fileName.length > 0)){
      	var downloadUrl = "../download?fileName="+encodeURIComponent(fileName)+"&filePath="+encodeURIComponent(filePath);
		$window.location = downloadUrl;
      }else{
      	alert("Please define a fileName for downloading...");
      }
}

Solution 4 - Javascript

javascript:alert(escape('?key=value1&key2=value2'));

Works fine for me?

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionrmwView Question on Stackoverflow
Solution 1 - JavascriptbobinceView Answer on Stackoverflow
Solution 2 - JavascriptReyraaView Answer on Stackoverflow
Solution 3 - JavascriptBRS13View Answer on Stackoverflow
Solution 4 - JavascriptGary GreenView Answer on Stackoverflow