[bug]: query parameters are escaped implicitly

[liudonghua123]

Is there an existing issue for this?

• I have searched the existing issues

Current behavior

When I send a Get request with the following parameters(in bulk edit).

token: token_part1 token_part2
attrs: password%3Dabc

The actual request sent is url?token=token_part1+token_part2&attrs=password%253Dabc which is wrong for my server.

If I send the same Get request using postman, the actual request sent is url?token=token_part1%20token_part2&attrs=password%3Dabc which is correct for my server.

I found the problem code is around the following code.

hoppscotch/packages/hoppscotch-app/src/helpers/strategies/ExtensionStrategy.ts

Lines 64 to 70 in dc80cc8

	const url = new URL(reqClone.url ?? "")
	for (const [key, value] of reqClone.params.entries()) {
	url.searchParams.append(key, value)
	}
	reqClone.url = url.toString()

url=new URL("http://localhost")
url.searchParams.append('token','token_part1 token_part2')
url.searchParams.append('attrs','password%3Dabc')
console.info(url.toString()) // http://localhost/?token=token_part1+token_part2&attrs=password%253abc

url=new URL('http://localhost/?token=token_part1+token_part2&attrs=password%253abc')
console.info(url.searchParams.get('token')) // token_part1 token_part2
console.info(url.searchParams.get('attrs')) // password%3Dabc
console.info(decodeURI('http://localhost/?token=token_part1+token_part2&attrs=password%253abc')) // http://localhost/?token=token_part1+token_part2&attrs=password%3Dabc

See also https://developer.mozilla.org/en-US/docs/Web/API/URL/toString, https://javascript.info/url, https://url.spec.whatwg.org/#URL-stringification-behavior.

Steps to reproduce

1. Go to Parameters tab, click Bulk edit.
2. Fill with the following contents

token: token_part1 token_part2
attrs: password%3Dabc

3. Click Send button to make the request.

Environment

Release

Version

Cloud

[liudonghua123]

If I send the request with the following parameters.

token: token_part1 token_part2
attrs: password%3Dabc

Then the request is ok. It seems the space in url query string can be encode/escape as + or %20. Both of them work.

So maybe the request works in postman is because it checks whether some spaces are in the parameters or not, encodeURIComponent is called if some spaces are included. It will NOT encode/escape the parameters.

A config setting toggles the encode/escape functionality would be nice for test purposes.

[liudonghua123]

The space character is the only character that has two acceptable URL-encoded representations. Instead of encoding a space as “%20,” you can use the plus sign reserved character to represent a space.

https://www.fullhost.com/blog/what-does-20-mean-in-a-web-address/

url1=new URL('http://localhost/?token=token_part1+token_part2&attrs=password%253abc')
url2=new URL('http://localhost/?token=token_part1%20token_part2&attrs=password%253abc')
console.info(url1.searchParams.get('token')) // token_part1 token_part2
console.info(url2.searchParams.get('token')) // token_part1 token_part2
console.info(url1.searchParams.get('token') === url2.searchParams.get('token')) // true

[AndrewBastin]

Since the current implementation is correct according to the spec, we are prioritizing this as a low priority issue.

PR contributions for implementing the toggle for considering both ways are welcome in the meantime :)

[Rathan-Naik]

Just getting started on contributions @AndrewBastin I can work on implementing the toggle.

[AndrewBastin]

Cool @Rathan-Naik, please do let me know if you need any help/guidance.

Assigning the task to you.

[Ahishekoza]

Hello @AndrewBastin,
I would like to contribute to this issue

[JManan]

hey @AndrewBastin i would like to contribute to this issue. Please let me do it.

[AndrewBastin]

@JManan sure.

[Pheonix075]

hey @AndrewBastin I would like to contribute to this issue.give me a chance

[VinayakSingh2001]

Hey @tejakummarikuntla I would like to work on this, can you please assign this to me !!

[tejakummarikuntla]

Sorry @VinayakSingh2001 , I don't think I can help you here. Did you mean to tag @AndrewBastin ?

[yashnirmal]

Hey @tejakummarikuntla is the issue still open?

[liudonghua123]

No PR currently?

I suggest to add a configuration named Encode(Encode the query params, three options provided, enable means always encode the params, disable means do not encode the params and auto means encode the params which contain some common special characters need to encode).

And only two group of settings available now, one for Theme, another for Interceptor. Maybe a new group named Other is a good idea for this new Encode setting.

[meetdhanani17]

it is need to add a toggle like space as %20 or + or i change to direct convert space as %20?

[maneeshms]

@tejakummarikuntla If this issue is still open and no PR raised yet, i would like to give a try.

[liyasthomas]

Assigning to @maneeshms.

[TheDynamicPunk]

Hey @liyasthomas it's been a while since there has been some activity on this thread. If you've still not received any PR's for this, maybe I can take a look with some assistance from you?