Develop Reference

Firefox converts URI to URL: How to force it to display URI

I want to generate an URL in which the whitespace is encoded to "%20", but the Browser automatically converts "%20" to whitespace. It's just a problem with Firefox and "%20"/whitespace. The comma "%2C"/, is not converted...
Is it possible to force firefox to show the URI and not converted URL?
The URL in the Browser should look like this (with %20 instead of whitespace)
But Browser automatically converts it to this (with whitespace)

have a try with the second part of this code
const urlString = `https://www.sample.com/events?area=frankfurt am main`
let url = new URL(urlString);
console.log(url.toString()); // your %20
url = new URL(urlString.replace(/ /g,"+"));
console.log(url.toString()); // + instead of %20

Try this
console.log(encodeURI('domain.com?q=something text'));

EncodedURIComponent getting encoded again after using EncodeURI

Im trying to endcode a URL. One of the param value in the URL has & in it and hence we are using encodeURIComponent to encode it. After that, we also need to encode the whole URL, and the encoded values are getting encoded again. What should we do in this case?
Value to be encoded, encodeURICOmponent('A & B')
encodedvalue = A%20%26%20B
Query param = {"filter":{"ab":{"$like":"%A%20%26%20B%"}}}
encodeURI(param)
finalURL = %7B%22filter%22%3A%7B%22e2%22%3A%7B%22%24like%22%3A%22%25A%2520%2526%2520B%25%22%7D%7D%7D

Only apply the encoding once.
const value = 'A & B';
const param = JSON.stringify({"filter":{"ab":{"$like":value}}});
const url = encodeURI(param);
console.log(url);

Is it possible to get this part of a string

I wonder if it's possible to get this part of a string.
Here is my string:
var string = "www.somesite.com/o/images%2Fc834vePyJ3SFVk2iO4rU0ke1cSa2%2F12391381_10205760647243398_2385261683139818614_n.jpg?alt=media&token=7a692a38-6982-474f-bea5-459c987ae575";
Now I want to be able to grab just this part of the string, the file name:
12391381_10205760647243398_2385261683139818614_n.jpg
I tried:
var result = /[^/]*$/.exec(""+url+"")[0];
, but it will return
user%2Fc834vePyJ3SFVk2iO4rU0ke1cSa2%2F12391381_10205760647243398_2385261683139818614_n.jpg?alt=media&token=4c92c4d7-8979-4478-a63d-ea190bec87cf
My Regex is wrong.
Another this is, the file extension can be .png or jpg so it's not fixed to jpg.

You could use a regex to isolate the part you want :
This works :
var string = "www.somesite.com/o/images%2Fc834vePyJ3SFVk2iO4rU0ke1cSa2%2F12391381_10205760647243398_2385261683139818614_n.jpg?alt=media&token=7a692a38-6982-474f-bea5-459c987ae575";
console.log((string.match(/[A-Za-z0-9_]+.(jpg|png|bmp)/))[0].substring(2));

Note that may have to be adapted depending on how much the URL string changes:
var string = "www.somesite.com/o/images%2Fc834vePyJ3SFVk2iO4rU0ke1cSa2%2F12391381_10205760647243398_2385261683139818614_n.jpg?alt=media&token=7a692a38-6982-474f-bea5-459c987ae575";
var out = string.split('?')[0].split('%2F')[2];
console.log(out); // "12391381_10205760647243398_2385261683139818614_n.jpg"

Assuming, you always have an url, first I would decode the encoded / (%2F) characters via:
var string = "www.somesite.com/o/images%2Fc834vePyJ3SFVk2iO4rU0ke1cSa2%2F12391381_10205760647243398_2385261683139818614_n.jpg?alt=media&token=7a692a38-6982-474f-bea5-459c987ae575";
var decodedUrl = decodeURIComponent(string);
and then use a regex:
decodedUrl.match(/[^/]*(?=[?])/)
Mind, that this regex assumes parameters (the part starting with ?...) are present, so if that's not the case, you might have to alter it to your needs.

If the filename always has a .jpg extension:
var url = decodeURIComponent(string);
var filename = url.substring(url.lastIndexOf("/")+1, url.lastIndexOf(".jpg"))
If not:
url = url.substring(url.lastIndexOf("/")+1)
filename = url.substring(0,url.indexOf("?"))

Looking at the string, it appears that the file name is between the second occurrence of "%2F" and the first occurrence of "?" in the string.
The first step is to get rid of the part of the string before the second "%2F". This can be done by splitting the string at every "%2F" and taking the third element in the resulting array.
var intermediate = string.split("%2F")[2]
Then, we need to get rid of everything after the "?":
var file_name = intermediate.split("?")[0]
This should give you the file name from the URL

How can I convert URLs to base64 without outputting '/' characters?

Question: can I be certain that Base64 encoded URLs won't output '/' characters?
Background: Firebase uses a key/value structure, and its key names, per the docs,
"can include any unicode characters except for . $ # [ ] / and ASCII
control characters 0-31 and 127"
I'd like to use URLs as a key for one of my collection, but obviously the '/' and '.' make raw strings a no-go.
My plan (to which I'm not married) is to convert the URLs into Base64, using either the browser's functions (atob() and btoa()) or a dedicated function/NPM module (as discussed here).
However, Base64 outputs can include '/', which breaks Firebase rules.
Would the characters a URL might contain ever produce a '/'?
If so, is there any reason I shouldn't just add a simple String.replace() to the front/back of the Base64 encoding function?

Taking suggestions in OP comments (thanks ceejayoz, Derek), it looks something like this will work:
let rawUrl = "http://stackoverflow.com/questions/38679286/how-can-i-convert-urls-to-base64-without-outputting-characters?noredirect=1#comment64738129_38679286";
let key = btoa(encodeURIComponent(url));
let decodedUrl = decodeURIComponent(atob(key));
rawUrl == decodedUrl // True

You can always just replace those characters after base64 encoding them, and then replace again when decoding.
const fireBase64 = {
encode: (str) => btoa(str).replace(/\//g, '_'),
decode: (b64) => atob(b64.replace(/_/g, '/'))
}

The possible characters in a base64 string are
ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/
If you don't want /, just replace it with another character not present in the list above, e.g. _.
var string = "ü";
var encoded = btoa(string).replace(/\//g, '_');
var decoded = atob(encoded.replace(/_/g, '/'));
console.log(btoa(string).indexOf('/') > -1); // true :(
console.log(encoded.indexOf('/') > -1); // false :)
console.log(string == decoded); // true :)

Javascript replace url with string

I have a string of url encoded characters.
wondering if there is a javascript function that can replace all the url encoded characters with normal string characters.
i know i can use the replace function, but it only replaces one certain character an not all at once
for example, I am looking for one function that will replace all the url encoded characters in this string:
string urlEncoded = '1%20day%20%40work!%20Where%20are%20you%3F'
and give me this string:
string replaced = '1 day # work! Where are you?'
thanks a lot

Use decodeURIComponent(string) for that purpose.
string urlEncoded = '1%20day%20%40work!%20Where%20are%20you%3F';
string replaced = decodeURIComponent(urlEncoded);
alert(replaced);
More info here: https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/decodeURIComponent

string replaced = decodeURIComponent(urlEncoded);
There is also just decodeURI but this does not cope with "special" characters, such as & ? ! # etc

Use decodeURIComponent(urlEncoded)

You are looking for unescape
var decoded = unescape(urlEncoded);