Gatsby: Special characters in URL show blank 404 page

[dengdengyee]

Description

Adding /index to url shows a blank page.

Describe the issue that you're seeing.

Steps to reproduce

gatsby new gatsby-index
cd gatsby-index
yarn build
yarn serve

and then go to browser, append /index to url.

Or just go to gatsby showcase and type /index
For example,
https://www.gatsbyjs.org/showcase/impossiblefoods.com
this one,

https://impossiblefoods.com/index

this page shows blank

Clear steps describing how to reproduce the issue. Please please please link to a demo project if possible, this makes your issue _much_ easier to diagnose (seriously).

How to Make a Minimal Reproduction: https://www.gatsbyjs.org/contributing/how-to-make-a-reproducible-test-case/

Expected result

Mabye redirect to / ?
What should happen?

Actual result

Just shows blank page

What happened.

Environment

You wouldn't need this to reproduce

Run gatsby info --clipboard in your project directory and paste the output here.

[dengdengyee]

I think these issues are related.

https://github.com/gatsbyjs/gatsby/issues/18481
https://github.com/gatsbyjs/gatsby/issues/19311

[LekoArts]

Thank you for opening this!

I don't follow why adding an /index should work? This would mean that the site needs to have a file at /index/index.html which it doesn't. If you add a /index.html to the URLs on our .org site you'll be redirected to the URL without .html. That's a setting on your host.

We're marking this issue as answered and closing it for now but please feel free to comment here if you would like to continue this discussion. We also recommend heading over to our communities if you have questions that are not bug reports or feature requests. We hope we managed to help and thank you for using Gatsby!

[dengdengyee]

Oh sorry, I should have described the issue more clearly.
I didn't mean /index should "work" without /index/index.html.
It is not redirecting to /, just showing a blank page.

Yes, gatsby.org, /index is safely redirected to /. However, a fresh started project with gatsby new gatsby-site, /index is not redirected to /. It just showing white blank page.
Is this intended feature of gatsby?

Any other none existing pages like /something, /indexxx showing 404 page as expected but /index is not. It just stays still and showing the white blank page.

[LekoArts]

You need to handle that yourself on your host (the redirects). As .org is hosted on Netlify and uses https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-plugin-netlify this is working.

[dengdengyee]

Yeah, maybe I can redirect the /index specific routes to the home with my server or any other hosting services like netlify or now.

I just felt weird that every other urls which doesn't have any matching page in the project shows 404 page as expected but only the /index is showing a blank page not the "404 page" nor "index.html"...

I want to know if this is an intended and expected behavior.

[dengdengyee]

https://bejamas.io/index
https://impossiblefoods.com/index
https://www.element84.com/index

These pages (They're on the gatsby showcase) are also showing a blank page on this the /index url.

[wardpeet]

It's an issue with our Reach router resolving.
https://github.com/gatsbyjs/gatsby/blob/4db2ff1835b7de06092f3b59dfc3aeddec73c5d1/packages/gatsby/cache-dir/production-app.js#L74-L85

This fails when the url already has a % sign. It gets double escaped. Unsure about the /index route, haven't debugged it yet

[PatrikModig]

Any updates on this? :)

[beliayeu]

I believe pr #20165 resolves the problem mentioned in the ticket title, but the problem mentioned in the ticket description still exists. probably it is worthwhile to move the problem from the ticket description to a separate ticket.

steps to reproduce for the problem that PR addressed:

1. open https://www.gatsbyjs.org/%EC%95%88%EB%85%95404 (url with unicode character to non-existing page)

expected: 404 page
actual: white screen

steps to reproduce for the problem that still exists

1. gatsby new gatsby-index
2. cd gatsby-index
3. yarn build
4. yarn serve
5. open http://localhost:9000/index

expected: 404 page
actual: white screen

this problem is not reproduced on gatsby.org since I believe the redirection from /index to / is configured on webserver side.

I believe the root cause of the problem with '/index' page is that gatsby renders it as 404 on the server side, but '/index' is resolved to homepage (but it should be resolved to 404) on the client side. '/index' is resolved to the homepage as index/page-data.json exists on the server. index/page-data.json was created and contains data for '/' page.

as an option to solve this problem, we can resolve '/index' to 404 without sending network request to page-data.json. probably we can do it in loadPage phase - https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby/cache-dir/loader.js#L165

cc: @wardpeet, @pieh