In my Next Js application when I refresh on a page it works fine locally but when I refresh on staging, url changes from staging-url/route to staging-url/#!/route. Can someone help me what is the problem with the routing here?
Related
I am working on a personal project for my portfolio and I'm completely stuck.
I have an Angular 14 app I've been working on. The stack is PEAN. I currently have a live version of it hosted on Heroku. The issue I'm running into is that in my local development version of the app, everything works as intended, however on the live version on Heroku, If I refresh the page using f5 while on the main backlog page, it does not refresh, and instead shows a blank page with "[ ]" at the top of the page. Every other part of the app functions fine, and it does not fully crash when I run into this issue. If I type a different URL in and go to that page, it works again. If after doing so, I click a link that loads the crashed component, it will reload just fine. It appears that the component only breaks if I refresh the component with f5 (or clicking the refresh button on chrome).
I've been working on this for a long time and I think I've narrowed it down a bit. So far I've:
confirmed that my express server is serving my static HTML files from their folder correctly
added a catch all code block at the bottom of my express file to redirect to index.html
made sure that Heroku was actually executing my server.js file
removed potential offending portions of code, like auth/error interceptors and newly added Google Sign-in
I've also:
checked with various browsers/mobile browsers
checked for console errors (there are none)
checked network tab on refresh. (just shows a 304-OK response)
checked Heroku logs. No errors there either.
The issue can not be recreated locally, and it only happens on refresh of one component, the Backlog component.
If there is any more info I can add please let me know, I'm hoping this is a regularly encountered issue. I can't seem to find anything that specifically deals with my exact issue by searching. Any help is greatly appreciated.
update
The blank page with "[ ]" appears to be my database's response when hit without a user ID to check against, and return data. I've narrowed this down to an HTTP-INTERCEPTOR that injects the user ID into the headers, which the route that would use that info for the DB wouldn't have. This makes my DB return "[]".
The only thing I don't understand is that this happens only when hosted on heroku, and not locally.
I am new to coding, completed developing sample MERN app, app is up and running on Heroku, but on first load only my data is rendered but the template is not rendered.
In my home page instead of JSX it only shows JSON data from backend, but when I manually change the URL to other pages it renders fine.
I already referred to Heroku only displaying backend of MERN app. How can I fix this? but none of the answer seems to be working.
Can anyone help me to resolve the issue?
I am trying to save OAuth tokens for a chrome extension. I have created a page where a javascript code runs which fetches the tokens from the URL and saves them to chrome's local storage. It was working fine until recently and now when it redirects to that page, it displays an error Requests to the server have been blocked by an extension. When I manually refresh the page, the error is gone and the script works fine. I tried location.reload() w/o true & setting location.href in the javascript code, nothing seems to be working.
I have two questions
How to avoid this error?
Is there a better to store OAuth credentials? The documentation seems to be outdated.
I've created a simple TODO list application using MERN stack, and it works find locally. I have deployed it to Heroku and the react page loads up, but it doesn't connect to my MongoDB database.
It seems like since my axios code is set to localhost it is not getting the information from the database. I belive there is a way to set it so that instead of localhost it retrieves the correct url, but i don't know how to do that.
Thank you.
axios.get("localhost:5000/user")
You can use "/" instead of localhost:5000 axios will send request to the current base url.
I am try to use this GitHub repo: https://github.com/jskrepnek/chatiNG
I adapted it to my website and everything is fine but except messages are gone when I refresh the page. I add restore:true to subscribe but that didn't work. My website is AngularJS based. So what causes this?