Inconsistent decoding/encoding of params between server and client

[trotzig]

I have a link that contains a param that needs to be url-encoded, constructed using

<Link route="foo" params={{ bar: 'some / value' }}>
  <a>Foo</a>
</Link>

The <a> tag constructed as a result of this looks something like <a href="/foo/some%20%2F%20value">Foo</a>, which is what I would expect (params being encoded before injected in the url). If I go to this url through server-side rendering (e.g. command-click to open in a new tab), query.bar is the encoded string, "some%20%2F%20value". If I click this link to cause a client-side page load, query.bar is no longer encoded, "some / value".

I think the bug here is that the server-side should decode params before passing them down to query. That would make the behavior consistent with how next.js passes down regular query params as well (on the form ?foo=some%20value).

[jly36963]

I am having the same issue:

onClick={() => Router.push(`/programs/?program=${encodeURIComponent(fetchedProgram.name)}`)}

onClick={() => Router.push({ pathname: '/programs/', query: { program: fetchedProgram.name }})}

The URI is not encoded following the client-side transition.

I get "Program 1" instead of "Program%201" in the URI.

[jly36963]

I'm pretty sure that this is not a Next.js issue. It is a Mozilla firefox issue. If I open my application on Edge (Chromium Beta), The URI remains encoded and the instances of %20 aren't replaced with spaces.

[sejanH]

Getting the same on both Mozilla Firefox and Google Chrome. My encoded url is /category/Offer%2FKit/ but upon reload it becomes /category/Offer/Kit/ Any workaround about this?

[jzheng-move]

Same here, getting the same issue across all browsers. Can we re-open the issue so someone can help?

[LefanTan]

Same here