Page not found for route "/login"

I have a problem similar to the ones above, I can’t find my route “/login” that comes with this error:

Captura de Tela 2020-10-09 às 10.15.32

There was no problem with the deploy, what could have happened?

HI, @gabihtoledo0. I split this question into its own topic because I don’t have enough information to troubleshoot.

This is the best place to start for “Page Not Found” issues (the page this was moved from).

If you are still seeing issues after following the troubleshooting steps in this guide, please let us know which site is affected and we will be happy to troubleshoot further. Also, please let us know what was found in the downloaded deploy.

1 Like

Hello, Luke thanks So much for splitting this Discussion into a new page on it’s own.
I am actually having this problem since I started today with Netlify.
Please Kindly Help me. I downloaded my hosted Vue app I hosted and I got the index.html file and the build.js file. I really do not understand the troubleshooting tips you mentioned here.
So here is a link to my hosted app.https://optimistic-neumann-70f749.netlify.app/

The routes do not work well if I reload the page when it’s on /route but it works when I route into it From the app.

Hi, @Nyosky. This is a common issue and there is definitely a solution!

If I click on “Portfolio” the URL changes to https://optimistic-neumann-70f749.netlify.app/portfolio. However, if I copy/paste that URL into the address bar (or click on this link), the page is a 404 “not found”.

We have a support guide that covers this here:

To summarize, there is a “Redirect” rule added to the site that always routes all URLs to index.html. Once that is done your site’s javascript will handle the “client side routing” just like it does when you click on a link on the page.

If that doesn’t fix it or if there are any questions about this solution, please let us know.

ok so here Is the fix I added in my routing which is still not working for me.
{
path: ‘*’,
redirect: ‘/’
}

I redirected all Wildcard Back to the Homepage But it’s still showing me the 404 Error.
Link to the Updated page. I changed the name

@Nyosky Have you tried clearing your browser cache? You site seems to be loading for me – no 404, just a simple HTML page that uses Bootstrap 4.52.

The site Is actually working when you visit it. you can navigate around well. But the 404 am talking about is when you visit the page like this https://stocktrading.netlify.app/portfolio that is when it gives the 404 But It works when you just visit https://stocktrading.netlify.app/ and navigate through there Directly

@Nyosky And this page doesn’t help you?

Hi, @Nyosky. You need to add this rule to netlify.toml or _redirects. Adding the rule will resolve the issue.

This is the website link.
https://uniwire.netlify.app/login

I followed your tips but I still have this problem, the deployment was successful. :frowning:

Please am new to netlify so I don’t really know where to add the rules you told me.
If you don’t mind can you please start the tutorial from where I will add these rules to netlify?

Hi, @gabihtoledo0. There is no login.html file for this site. These are all the files for the current deploy of uniwire.netlify.app:

/robots.txt
/precache-manifest.ff6cc5f93de1d63d55941d9b8c790b73.js
/service-worker.js
/asset-manifest.json
/manifest.json
/favicon.ico
/index.html
/static/js/2.084435d2.chunk.js
/static/js/runtime-main.f17ca920.js.map
/static/js/main.bb3e8b2d.chunk.js.map
/static/js/2.084435d2.chunk.js.map
/static/js/2.084435d2.chunk.js.license.txt
/static/js/main.bb3e8b2d.chunk.js
/static/js/runtime-main.f17ca920.js
/static/media/logo-black.04712d97.svg
/static/media/world-login.06c252e9.svg

I loaded the index.html file but there is no login link on that page. Would you please tell us more about what you are trying to do?

@Nyosky, for your question you need to add this rule to one of two files below:

  • _redirects
  • netlify.toml

There is more documentation about this here:

https://docs.netlify.com/routing/redirects/

After adding the rule to one of those two files, trigger a new deploy. If there are questions about how to do this, please let us know what steps you have taken so far and we will be happy to assist.

The file being defined the route /login is Routes, which is being called by index.js.
On site, everything works but in production I don’t know what’s going on.

i don’t actually see an index.js?

when things work locally but not live, it is often a case issue:

Can you give this a read through and let us know if that fixes this?

Hi, @gabihtoledo0. The file index.js is used to “build” the site. That file doesn’t exist once the site is deployed.

The deployed site’s javascript files do handle the route “/login” correct. This javascript is doing “client side routing”:

Right now, your client side routing only works when you click on the links in the page but not when you copy/paste a URL. This happens because the web server returns a 404 not found because there is no file named /login.html. Your client side routing never triggers because the servers sends a 404 first.

The solution for this is to create a “Redirect rule” at Netlify. This causes the server to send your index.html file for /login. Then your client side routing can handle the URL instead of the 404.

If you create the redirect rule below, then the “client side routing” will work:

/*    /index.html   200

The line above need to be put into a file named “_redirects” and that file need to be put in the publish directory for this site. This will resolve the issue.