Javascript URL has illegal characters in it

Question

I'm working with Cloudinary, an image hosting service. I am currently storing my URLs as strings such as: http://res.cloudinary.com/dhulxtn8x/image/upload/v1400107030/zz06phflcmal8xmpg2hh.jpg

I need to add a setting parameter to the URL, so I am splitting it, inserting the setting and then joining it back. However, I am getting illegal characters when I combined it back together. Here is my code:

var fileSplit = file.split('/');
var uploadUrl = fileSplit.splice(0, 6).join('/');
var uploadId = fileSplit.splice(0, 8).join('/');
var thumbnailSetting = '​/c_fill,h_150,w_100';
var uploadUrl = uploadUrl + thumbnailSetting + uploadId;

The console.log() says: http://res.cloudinary.com/dhulxtn8x/image/upload​/c_fill,h_150,w_100v1400107030/zz06phflcmal8xmpg2hh.jpg however my console also then says:

GET http://res.cloudinary.com/dhulxtn8x/image/upload%E2%80%8B/c_fill,h_150,w_100v1400107030/zz06phflcmal8xmpg2hh.jpg 400 (Bad Request)

You can see the illegal characters after upload. How can I get rid of these without removing characters that I might need.

Answer 1

var thumbnailSetting = '​/c_fill,h_150,w_100';
thumbnailSetting = encodeURI(thumbnailSetting );

That will take care of it for you.

EDIT

You have an invisible character in this line, right after the opening quote:

'​/c_fill,h_150,w_100';

I noticed it while making this JSFIDDLE. I left it so you can see. That code was copied directly from your question. Remove it and you should be good.