Javascript - encodeURI() returing different results in different browsers

Question

I use encodeURI() to encode a php request url, it works perfectly fine in Firefox and Chrome but it doesn't in IE/Edge.

The actual url is: http://localhost/get.php?id=e_e2&title=e2&desc=just a note&stime=6/12/2015, 1:00:00 AM&etime=15/12/2015, 1:00:00 PM

What Firefox returns is (works): http://localhost/get.php?id=e_HO%20Event%201&title=HO%20Event%201&desc=This%20is%20just%20a%20test%20event%20of%20this%20handover%20only&stime=6/12/2015,%201:00:00%20AM&etime=10/12/2015,%201:00:00%20PM

What IE returns (Break the php code): http://localhost/get.php?id=e_HO%20Event%201&title=HO%20Event%201&desc=This%20is%20just%20a%20test%20event%20of%20this%20handover%20only&stime=%E2%80%8E6%E2%80%8E/%E2%80%8E12%E2%80%8E/%E2%80%8E2015%E2%80%8E%20%E2%80%8E1%E2%80%8E:%E2%80%8E00%E2%80%8E:%E2%80%8E00%E2%80%8E%20%E2%80%8EAM&etime=%E2%80%8E10%E2%80%8E/%E2%80%8E12%E2%80%8E/%E2%80%8E2015%E2%80%8E%20%E2%80%8E1%E2%80%8E:%E2%80%8E00%E2%80%8E:%E2%80%8E00%E2%80%8E%20%E2%80%8EPM

I have tried to decode what IE returns but it caused me a lots of problems!, so is there an alternatives to encodeURI() ?, FF seems to work even if I dont encode the url, where IE works if I copy the FF encoded url to it!

update: example code link

I think it has something to do with toLocaleString()

Final update:

As few answered, it was some weard marks in the link "appears only in IE!" I had to filter and changes what my php script date format to remove the comma

function FixLocaleDateString(localeDate) {
    var newStr = "";
    for (var i = 0; i < localeDate.length; i++) {
        var code = localeDate.charCodeAt(i);
            if (code != 44 && code != 8206 ) {
                newStr += localeDate.charAt(i);
            }
    }
        return newStr;
}

I found this function in another answer and modify it: ToLocaleDateString() changes in IE11

@SyntaxLAMP not, it will mess up the whole url and will not work anywhere @MaxZuber this is the code `var phphref = 'http://localhost/get.php?id=e_'+event.title+'&title='+event.title+'&desc='+event.description+'&stime='+stime+'&etime='+etime; console.log('url only:'); console.log(phphref); //fine function myFunction(uri) { var res = encodeURI(uri); //console.log(res); return res; } var calfile = myFunction(phphref); console.log('encoded:'); console.log(calfile); //fine in ff, not in ie !` thanks — et3rnal, Dec 13 '15 at 10:36

jcaron · Accepted Answer · 2015-12-14T01:24:26.717

5

The problem is not encodeURI (though as others have pointed out, you should never use encodeURI, but rather encode individual components with encodeURIComponent and then join them together).

The problem is that the dates for some reason contains lots of U+200E "LEFT-TO-RIGHT MARK" characters (which are invisible, but still present), which once encoded become %E2%80%8E.

Show us where/how you get the times, or filter the time strings to remove those characters before encoding.

edited Dec 14 '15 at 01:24

answered Dec 13 '15 at 10:47

jcaron

17,302
6
32
46

I think I found the problem which causing all that! (maybe), looking at the result of generated url in both browsers I found ther is a missing (,) in IE, which turned out to be because of the toLocaleString(), as in IE it returns a different value if you are not in US. now according to [link](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleString) I used `toLocaleString('en-US');` but its not making any different yet ;\ – et3rnal Dec 13 '15 at 11:17
My code is too big :\ but I have created this example which have the same problem if you test it in IE/FF [link](http://jsbin.com/zekefuteze/edit?html,output) – et3rnal Dec 13 '15 at 12:09
@et3rnal, I'm not sure I understand why you want to use `toLocaleString` for a date you're going to send to the server, which needs to be parsed by it. `toLocaleString` is meant to be used to convert a date a string that is directly presented to the user. For internal use, I recommend you either use the absolute timestamp value (number of milliseconds since the epoch), or `toISOString` which will deliver a date with a standard formatting you can be sure you can rely on. – jcaron Dec 13 '15 at 16:19
I re-read your answer after I run out of ways, finally I filtered the wired LTR marks as well as the comma! as I cant figure out why IE ignoring it. now works fine and this is the simple filtering function (I found it in another question and modify it) `function FixLocaleDateString(localeDate) { var newStr = ""; for (var i = 0; i < localeDate.length; i++) { var code = localeDate.charCodeAt(i); if (code != 44 && code != 8206 ) { newStr += localeDate.charAt(i); } } return newStr; }` – et3rnal Dec 13 '15 at 16:20
Thanks for the information, I might change it in the future. The reason im using it because its part of a plugin im using. – et3rnal Dec 13 '15 at 16:29
If you want to filter a string, there's a much quicker way to do so: `string.replace(/[,\u200e]/g,'')` – jcaron Dec 13 '15 at 16:38
Great will try it now, im looking at the toISOString() and the other getMonth() etc.. do u know if it is possible to construct something like this format 2013-03-16 12:00 AM ? – et3rnal Dec 13 '15 at 16:56
Thanks heaps, converted to ISO which solved another problem. – et3rnal Dec 13 '15 at 17:57
Nitpicking: your first parenthesis is never closed. – A.L Dec 14 '15 at 00:51

score 1 · Answer 2 · answered Dec 13 '15 at 14:10

Define a simple params object to represent desired URL parameters and glue its items. If there some incorrect characters in the properties, you need to filter them out before encodeURIComponent() call.

var params = {
  'id': 'e_'.concat(event.title.toString()),
  'title': event.title.toString(),
  'desc': event.description.toString(),
  'stime': stime.toString(),
  'etime': etime.toString()
};

var chunks = [];
for (var property in params) {
  if (params.hasOwnProperty(property)) {
    chunks.push(property.concat('=', encodeURIComponent(params[property])));
  }
}
var href = 'http://localhost/get.php?'.concat(chunks.join('&'));

console.log(href);

score 0 · Answer 3 · edited May 23 '17 at 12:31

0

Use encodeURIComponent when you want to encode a URL parameter.

Here is some useful links

When are you supposed to use escape instead of encodeURI / encodeURIComponent?

https://coderwall.com/p/y347ug/encodeuri-vs-encodeuricomponent

edited May 23 '17 at 12:31

Community

1
1

answered Dec 13 '15 at 10:39

Scarecrow

4,057
3
30
56

Javascript - encodeURI() returing different results in different browsers

3 Answers3