React App displaying error for http request - node.js

I deployed my react app with nodejs in https://learnhosting.herokuapp.com, its working well, apis(express) are also working properly.
But while accessing the site with learnhosting.herokuapp.com pages other than homepage not working i.e cannot GET /url. Also when opening this in mobile all pages except homepage showing cannot GET /url error for even https://learnhosting.herokuapp.com, how to fix this error?
Thanks in Advance.

Related

website not opening in first time shared link in browser angular 8 and nginx

bhaskarhindi.com id an angualr8 front end and Nginx server hosted in AWS instance using nodejs Redis API call to fetch data.
But after deploying and using hash the first time in the browser it is not opening showing 404 error.
But after a hard refresh or multiple time click it's opeing.
Any solution i have tried index.html aot and hashed build but not working.
404 is shown by the server itself, when it tries to find the route you have passed in the URL (as the server doesn't have access to that route, but Angular has).
You need to make sure that the server redirects all the 404 requests to the index.html of the Angular application. Only then Angular can pick up and show the pages accordingly.
Read through this: https://angular.io/guide/deployment#server-configuration for more information.

Why is app deployed to heroku opening with HTTP on mobile by default?

When I am using desktop browser(Chrome) everything is fine, I type appname.herokuapp.com and I got redirected to https:// but when I try to enter my application on mobile version of Chrome for android and I do the same thing it gets redirected to http:// and then I have to add "s" to URL. What could be a reason behind this?
App is wrriten with react.js, node.js, express, no database.

XMLHttpRequest cannot load http://localhost:5000/api/users/signup due to access control checks

I am using nodeJS and expressJS for backend and ReactJS for frontend of my application. Everything works fine when run locally on my computer. However, I recently have tried to deploy the app using Heroku. The app successfully launches at the given link from Heroku but then whenever I try to sign in/sign up I'm always thrown an error from the backend. The error is as follows when I am using Safari and Google Chrome respectively:
I have already enabled cors on my expressJS server, what is the likely cause of the issue?
It looks like your ReactJS code has the url http://localhost:5000/ hard coded in it somewhere. If your same Heroku instance serves the ReactJS and provides your API endpoints, then you should consider using
/api/users/signup
for the URL of your API endpoint instead of
http://localhost:5000/api/users/signup
This wrong URL shows up as an access control issue because browsers block external pages served by https to use localhost APIs. Because cybercreeps.

React theme working on localhost not in AWS Machine

I am on ReactJS v15.3.1, using node v8.3.1 and npm v5.0.4
I am trying to implement a react app using this theme SB Admin React
it's working fine when I run this into the localhost all pages loads fine and everything working as expected, but when I move this theme to my AWS machine with the same configurations(node and npm) as my localhost it starts throwing this error on browser console:
GET http://34.192.38.113:3001/assets/main.js?6f764c822b1f287a2e02 net::ERR_CONTENT_LENGTH_MISMATCH
Maybe because of this whenever I click on any link on my theme page on browser it refresh the page and shows the same error
I tried using different themes as well but the same error (highlighted in code block) persist with all of them.
I am unable to get the root cause for this,
Also, I've made all the ports available in my AWS machine.
How to rectify this issue?

angularjs - routes not working when typed

Could anyone explain why when I click on a link my angular views get shown fine but when I type in an address into the address bar in the browser (which is the same as where the links that work point to) such as localhost:8080/login I get a Cannot GET /login message.
My routes are set up in Angular and I'm using Node and Express 3 on the back-end.
What silly mistake am I making?
Most likely you're getting angular and your webserver mixed up.
The webserver probably doesn't know to server your angular base page when the /login URL is entered. You need a catch-all handler on your nodejs server.

Resources