3

First of all, I would like to create a page that takes the URL parameter (e.g. /test/hell, which test is the page and hell is the parameter).

Therefore I created a page that takes the parameter and shows it on the title (example, with the added page link at the bottom), based on the Gatsby getting started project. It seems working.

But when I open the full URL on the browser (link), it first pops up the 404 pages and then flashback to the correct content (please refresh the page to see the 404 pages). The 404 page is not what I expected so I am not sure if how to get this fixed. Also, this problem is not being observed when I run Netlify/Gatsby locally. Here is the 404 page during webpage refresh:

Deployed site with refresh

This is the added code and this is the only commit that I made. I am not sure how to get rid of the 404 pages being displayed.

Thanks for the help.

Sohail Ahmad
  • 7,309
  • 5
  • 27
  • 46
Winston
  • 1,308
  • 5
  • 16
  • 34
  • Does this answer your question? [GatsbyJs client only paths goes to 404 page when the url is directly accessed in browser in "production"](https://stackoverflow.com/questions/52051090/gatsbyjs-client-only-paths-goes-to-404-page-when-the-url-is-directly-accessed-in) – ksav Feb 13 '20 at 03:08
  • Thanks for the info. I guess you are right, it has to do with the server-side redirect and the problem could be solved by installing `gatsby-plugin-netlify` plugin. The plugin will help getting the redirect done. – Winston Feb 13 '20 at 06:50

2 Answers2

3

I believe the problem could be solved by setting up the _redirects file, required by Netlify, and the plugin gatsby-plugin-netlify setup the _redirects file during build time.

Winston
  • 1,308
  • 5
  • 16
  • 34
1

I solved the problem by adding a trailing slash to my link URL: From: Link to="/contact" To: Link to="/contact/"

  • Great! Since the plugin works and it should deal with all kinds of situation, I would stick with the plugin. Thanks – Winston Sep 11 '20 at 02:08