Ember - Query params ignoring “=” character


#1

I have a query param “token” whose value includes “=” sometimes, but ember seems to ignore that value. When the queryparams supplied are like

search?token=123=

This doesnt work and the value of token in ember comes as 123 only, whereas if I supply that as encoded i.e. as

search?token=123%3D

the value comes correctly as 123=

Does ember ignores the decoded format?

I have created a twidde https://ember-twiddle.com/da8fc488e69d9cde65024571dbe70f3d?openFiles=templates.search.hbs%2C where this can be reproduced. Please run the url as given above to see that.

Read a couple of posts with serializeQueryParams in route but doesn’t seem to help.


#2

Letters (A–Z and a–z), numbers (0–9) and the characters ‘*’,’-’,’.’ and ‘_’ are left as-is and Ember correctly encodes = out of the box. See what happens if you type x=y as query param https://bloggr.exmer.com/posts?query=x%3Dy


#3

Even if i try search?token=123=x , it will simply return value of token as ‘123’ , is this correct, shouldnt the value given be “123=x”


#4

No this is correct see: https://en.wikipedia.org/wiki/Query_string?section=4#URL_encoding


#5

I am sorry, if i dont understand it correctly.

So, you are trying to say that Ember behaves correctly i.e. it ignores = , as its a reserved character (as per link) and hence we shouldn’t be having that value in url. Please correct me if wrong.


#6

Yes Ember behaves correctly. You are right!

See also how google works:

https://www.google.nl/#q=x%3Dy https://www.google.nl/#q=x=y


#7

Oh, now I get it. Thank you so much for clarifying this. This really helped.


#8

Sorry for bumbing an old thread but I don’t understand the difference in the two links? Both understand that x=y is the query. In ember you’ll end up with just x.

Note, this only fails when the value is set via the URL. If you set it from inside Ember it’ll be encoded and work.


#9

The = is allowed only as the separator between the name of the query parameter and its value. So you can do &x=y, but you cannot do &x=y=z. In the first case, the parameter x gets the value y. In the second case, it’s an attempt to make the parameter x get the value y=z, which isn’t allowed.


#10

Alright, thank you very much for the explanation.

So when this URL works, it is Google going further than the spec?
https://www.google.com/search?q=x=y=z=a/watch?=a=b=c

The reason I’m asking is we wanted an Ember route like so: /add-video?url=https://www.youtube.com/watch?v=yG-UaBJXZ80.


#11

@oskar have you tried encoding yoururl param like this?

encodeURIComponent('?url=https://www.youtube.com/watch?v=yG-UaBJXZ80.')

You can also grab the query search string by using window.location.search, which will make your code

encodeURIComponent(window.location.search);

I would actually recommend that you encode that url value like above which should work with Ember since you’re encoding the equal sign along with it. It’s better for security purposes too.