React route gives unauthorized on heroku while working in development - reactjs

I am working on React app using express in backend, and I deployed it on Heroku.
Now its working well except 1 route which gives me unauthorized message
My Heroku logs
And this route is working on development mode.
Also I checked the token of the user in the localStorage and its already there.
Anyone has any idea about this issue?

I figured out what was the problem after asking a friend of mine.
The problem was there was a conflict in routes between frontend and backend, so I added /api/ to backend routes and to the frontend baseUrl.
Ex:
in backend I was using the routes like app.use("/topic", topicRoutes);
in frontend my baseUrl was localhost:3000
To fix my problem, I changed the routes:
app.use("/api/topic", topicRoutes);
localhost:3000/api/
Hope it helps someone :))

Related

vite react express bug for mobile [Answer incoming]

There is a bug with vite react, it doesn't render the data from the backend to the frontend in mobile, but calling the backend /ping or routes with res json the backend does respond.
github:https://github.com/dev-ronaaldll/try-mern-mysql-crud
Creating a basic crud of tasks, the backend data is not displayed with react on mobile.
What extra configuration do it need to make it work?
I have the solution but I want to know if someone can help me.
1 Solution
replace the fetch/axios from localhost to "ip/192.168.1.100" works.
2 Solution
using a proxy conf in vite and react

Heroku returning 304's for requests to / route

I have a Rails 7.x application deployed to Heroku, with an embedded React front end. When I build for deployment, everything React based ends up in /public, including the React entry point index.html file. Everything works great locally via Rails / Vite.
However, when I deploy to Heroku, all of my calls to the root path, i.e. https://xyz.abc.com/, return 304's from the Heroku router, bypassing Rails and its routes entirely. Other routes work fine, it's only the root.
I've disabled caching across the board in my Rails codebase, but that hasn't worked since from what I can see Heroku is stopping the request and not even passing it off to my Rails dyno.
Here's an example from the Heroku logs, by passing my dyno entirely:
Log request for "/"
And here's an example from the exact same setup for a different route:
Log request for "/api/auth"
So I know the Rails backend is up and accepting requests, but just not for "/"
Any ideas what I could be doing wrong?

404 on auth0 callback when trying to login on app deployed on heroku

I have a PERN stack app using auth0 for login that is working fine on localhost but when deployed to heroku after I click to sign in I get a 404 on the callback.
The URL is exactly the same except for appname instead of localhost on all routes, i have also the env variables and callback and logout urls setup in auth0 correctly.
Is there anyone who has run into this and can help me solve this problem? Thanks.
check your port. I thought my port was 3000 (I'm using Next.js on Heroku with Auth0), but it actually isn't running on 3000, but whatever Heroku decides. I changed my auth0 Allowed Callback URLs and all is working!

is there any hostgator equivalent to netlify _redirect?

I made a website with React and I used react router for routing, my problem is:
When on a non route page the browser is refreshed, I got the hostgator standard 404 page.
I know why is that and I looking for a solution like at netlify.
At netlify I can use a file named _redericets and the problem is solved.

AWS Amplify ReactJS app trouble reloading page

I'm currently working on a full-stack project mainly using ReactJS and AWS Amplify. I've successfully deployed the website but the URL routings only seem to work if I redirect from the home page. I can only load the home page www.website.com but I try to manually type in www.website.com/login/, it gives me this message
<Error>
<Code>AccessDenied</Code>
<Message>Access Denied</Message>
<RequestId>B2173BDEE0658858</RequestId>
<HostId>
TRevHdaqGZYTUxU9W1wXc3CQccfLeznHlYLcbuF+Wr511FVmOPFBp4tpyccJ2t5QMVpvYygNNb4=
</HostId>
</Error>
I've looked up solutions from other StackOverflow pages but it didn't seem to solve the issue.
I have tried adding a redirect rule in the AWS console provided (Getting 403 ACCESS DENIED error when deploying React Web app on AWS Amplify) but the issue persists. Is there a way to fix this?
You have to set up a 404 (page not found) redirect on the AWS Amplify to point on the index.html.
React App is SPA (Single Page App) it has its own routing, and on the AWS side, all other routes except base path will return 404, because they don't exist on the server-side.
Once you setup 404 to points on your React application again, React router will handle the routing.
Check: docs.aws.amazon.com/amplify/latest/userguide/redirects.html and pay attention to 404 redirections.

Resources