How to translate URL Encoded Key

When working with symbols in URL such as greater than (>) or less than (<) they can encoded not in the URL but in what Bubble will return as the paths segment as a list item #

Screen Shot 2021-01-05 at 5.19.53 PM

This is what is displayed in the URL address Bar of the browser

Screen Shot 2021-01-05 at 5.19.44 PM

Is there a way to automatically translate these back into the character?

As most characters are going to have their own specific encoded key and without needing to test what each gets changed to, is there a simple method to changed the encoded key back to whatever character it was originally?

URL encoded text should decode in a text element automatically. So maybe pull it into a hidden input ?

I gave it a shot but it didn’t translate it back.

Is it a method you have employed before? I feel like it may be an issue I should contact support about because it is the issue is basically the opposite of what I’d expect.

This is the link element that is set up for navigating

Screen Shot 2021-01-05 at 11.01.25 PM

And here is what the URL looks like in Browser Address Bar

Screen Shot 2021-01-05 at 11.02.19 PM

So it looks like the > symbol is not getting encoded inside of the Browser Address Bar, but the dynamic expressions used to extract a path segment as a list item using a text element, in conditionals and the input element are showing the encoded version.

Screen Shot 2021-01-05 at 11.04.41 PM

I would have assumed the Browser Address Bar would have the encoded value while all visual elements, input elements and conditionals would translate it back as is done when using dates or addresses in a URL parameter.

Even more weird is a test I just tried out…changing the symbol for the encoded keys in the link, causes the same issue and in fact the normal > symbol is in the Browser Address Bar

Screen Shot 2021-01-05 at 11.10.23 PM

Yes, I think so. A previous forum response suggests that I have. But it was a while ago, and I would agree it is not doing what it should.

1 Like

So…

I have a list of comma seperated (and thus encoded) text values in the URL that is pulled into an Input.

image

That is then decoded, so I can split it into a list using a Regex.

I heard back from a Bubble engineer who explained that what I am experiencing is expected behavior.

I just tested using commas and they don’t get encoded in the Browser Address Bar and are returned with a comma so maybe there is some difference in behavior based on the characters

This is the response from Bubble Engineer

The behavior is in fact working-as-intended. The way URLs work is they must always encode special characters (such as ā€˜<’). Although I’ve noticed that google chrome converts %3E to ā€˜<’ in the URL bar for display purposes, that appears to just be a Chrome quirk; Safari, for instance, still displays it as %3E in the URL bar.

In any case, from the website’s perspective, they are the same thing, so ā€œGet Page Data from URLā€ will always return the URL-encoded value, since that is what is in the URL (even if Chrome obfuscates the fact to the end user).

In any case the conditionals recognize the encoded key so maybe it is just a matter of always testing to see the encoded key to use it for conditionals.

Thanks for the help.

image

That is Edge.

Not that I can see.

image

I guess I will have to ask the engineer to look at the issue a bit more as this looks different than what my app is producing.

I don’t have edge to test with but using google chrome and firefox I see commas in the browser address bar, but get commas in the text fields, which is different than the < issue that shows the < in the browser address bar but the encoded value in the text fields.

1 Like

Ah, so for Get Parameter it translates.

For get path or path as list … it doesn’t.

image

And yes, it does turn %3E into > in the browser bar.

Okay, that makes sense then…that must be the difference.

Just tested it with a parameter and the < comes back as <

So we have the answer.

Thanks again for the help.

1 Like