I have a problem with my ReactJs. I created an app that when a user inputs a username and password, it takes him to his account that has a sidebar menu with different pages and routes. The routes work properly on the local server and when I reload each page, it reloads successfully. Yet, when I deployed my website on a testing server, it falls whenever I refresh the page and returns this error :
What could be the reason for this problem considering that it works locally with ease and the route is reloaded successfully. Does anyone know how to fix this problem?
Related
I have created a basic react login application using an external API from the following docuumentation : https://javascript.plainenglish.io/basic-react-login-using-external-api-e33322e480cd
So, I have made few changes in the code for routing part and it was working fine in the localhost.
Later I have created a build file for the react application and hosted it on the server.
After hosting I encountered the page showing blank so when I looked for a solution I came across this How to fix the white screen after build with create-react-app?
and it says to overcome we have to add "homepage":".", in package.json file
so I have added it in the package.json and created a build file.
On hosting that build file I was able to successfully see the homepage, but later what the problem is I'm unable either refresh the page or login to the page using the credentials. When I perform either of those actions the page shows the error not found message.
Can anyone tell me what the problem I'm facing and any mistake in my application or it might be the problem on the server side.
What is the reason that making me not able to stay on page when refreshing and also why the page doesn't redirect to other page on entering the credentials.
The hosted application is this : https://www.bizwy.in/signin
My github repo of the project is this : https://github.com/BhupathiVenkataSaiCharan/auth-app
Let me know if you need something to exactly understand my problem. And guide me through the problem and help me solve it.
Suppose I have an e-commerce site, where i want to share product links on social media/send someone via messages. The issue on my app is when I share the link of product page it's not working on new browser where my app not loaded before.
I have checked on redux tools, it shows nothing loaded on it when manually typing the link to product page. After that if I visit homepage and refresh the page then everything gets loaded then everything works fine.
I have tried hash routing, it doesn't work either.
I think there is something wrong with my redux setup. Because static pages are working fine only issue when i share pages that loads data from server.
I'm stuck here. Can anyone help me out please
When I refresh the page, this error cause. But when I go from one page to another this works fine.
When I logout this doesn't work normally. After refreshing, I get the working page in my localhost but in the live server this causes the image one error.
This is my normal login page
I'm back (Refreshing React with Express server). I am hoping to figure out this issue.
Quick recap: I am trying to refresh my react website. If I go to www.domain.com/about I will get the:
Not Found
The requested URL was not found on this server.
same if I click on the button to get to /about and hit refresh I will get this error.
My goal
To be able to go to my site, click on another page (i.e. domain.com/anotherpage) hit f5 for refresh and get the same page.
I understand:
The problem is that React just changes the URL when I click on my React app button or link to go to a different page. Then when I refresh it looks for www.domain.com/whatever. Since there is nothing for it, it returns 404.
I also know that if I can get my React app to direct all traffic to index.html. React will handle the rest.
What I have tried:
In my previous post, it was suggested to use my hosting site to redirect traffic to index.html. However, my hosting site lets me adjust the DNS for subdomains but nothing after it. (ie. www.subdomain.domain.com works fine but www.domain.com/whatever doesn't) which I expected but I thought I would try.
I do have an express app however, it doesn't serve the files it just waits for a button to be pressed and then does stuff. I don't need to the server to run to have the website up.
I have tried creating a route in express for this and it looks like:
app.get('/*', (req, res) =>{
res.sendFile(path.join(__dirname + '/public/index.html'));
});
I still get the same 404 error with this.
I have also added an index.html to my server. Thinking it needed the .html file to send. (Thought it might be good).
What I don't know
Where does React look for index.html in production? When I look in the build files under asset-manifest.json there is an "index.html": "/index.html" line of code. Is there where it finds the index file? If so, can I change this to go to index.html on every page request?
Obviously I want the user to be able to refresh the page and get back to it. Can someone point me in the right direction?
Thanks in advance!
Having scaffolded an angular-material-fullstack project using the yeoman generator, I have run into a problem with its verification straightaway.
It seems that there's a bug from the outset, because when clicking Signup below, the app does not redirect to the signup page as it should, rather it stays on the log in page:
Even when explicitly typed in to the address bar (localhost:9000/signup), I still get relocated to /login.
I can get to the 'main' section of the app without logging in, however, the app gets confused by this, and doesn't know what to display for the menu buttons in the main menu (should be login and sign out):
Previously in this environment the app was working like a dream. This time I opted for uiRouter rather than ngRoute, and I'm wondering if, for some reason, this may be the cause of the problem. Any help warmly appreciated.