I am using react and nestjs,because my react project and the nest project are on the same server, I use 127.0.0.1 to access the API in react production mode, but I cannot access the service. Then I run the react project locally to access the API through the server ip and there is no problem. Where is the mistake?
web project in server
http://127.0.0.1:8000/admin/allposts net::ERR_CONNECTION_REFUSED
Try changing the ip to your server ip. Sorry, I cannot access your image posted, so it is only my guess.
http://your-server-ip:8000/admin/allposts
Related
I have a React website hosted on Github Pages, and a Flask Server running to put information on my ArangoDB server which is hosted on a machine that has HTTP address lets call it (http://21.23.24.25:8352)
The problem is that I try to show images which are stored on my local server for e.g.: http://21.23.24.25:8352/data/images/image.jpg
and I'm getting an error: net::ERR_SSL_PROTOCOL_ERROR
How can I bypass this other than creating a new ArangoDB server hosted on another machine, or creating a SSL Certificate on the machine.
I also paid for the pythonanywhere subscription, I thought maybe it was required to bypass the SSL issue. Any ideas?
I’m trying to deploy a basic react app to Azure app services, but I cannot get it to work.
The app itself is the initial app created following npx create react app my-app command. I want to get this one working first before trying to deploy my actual react app.
The Azure App Service is a Linux setup, using node 16.
I’ve added “pm2 serve /home/site/wwwroot --no-daemon” as the startup command. I’ve also added PORT 3000 and WEBSITE_PORT 3000 in app settings.
Lastly I’ve added a web.config file to the react app itself.
Nothing I do seems to work though as it is not loading at all. I just get ‘application error’ if I try to open the app.
The only two errors i can see in the logs are:
“…didn't respond to HTTP pings on port: 3000” and “… did not start within expected time limit”
My deployment is set as continuous via git hub, though as this is building without an issue I think the problem must be something in the Azure App Service settings but I’m lost as to what.
Does anyone have any ideas to fix this?
It could be that there is no access to port 3000 in the app service.
It depends on how you have set it up what needs to be fixed. It could be the network settings on the app service. If your app service is on a VNET then it could be the settings on the VNET that need to be updated.
I made a Dashboard using plotly Dash for my office and this Dashboard should go alongside a Digital report I made using React and plotlyjs.
Here is the structure of the website:
I used this Hackers and Slackers guide to run the dash app on flask server. I also integrated React and Flask successfully and was able to fetch data from flask to react and display it.
Now the issue I am facing is I am unable to access the dashapp at localhost:3000/dashapp. I was able to access the app at localhost:5000/dashapp. How can I make this accessible at localhost:3000/dashapp along with other react pages?
If you have two different applications, they cannot run on the same port. So one should run in 3000, and other in 5000.
However, you can have some apache configuration for redirecting the requests from browser to two different apps using one port. So, based on the configuration, if you do localhost:80/dashapp, this will point to localhost:5000/dashapp. And if you do localhost:80/reactapp, this will point to localhost:80/reactapp.
Refer to this for configuring the apache: https://geekflare.com/multiple-domains-on-one-server-with-apache-nginx/
I'm serving a built react file using Nginx. I am able to access the react app in the browser on my vm's IP address.
I have another server running on my VM on port 8080, the API of the react app.
In my react I use axios calls like
const http = "http://localhost:8080";
..
axios.post(`${http}/api/auth/login`, { credentials }).then(res => res.data.user),
In my browser after I access my VM's ip address I can see in the console that the so called axios calls go to http://myActualVMIpAddress/api/.. instead of the localhost path as I was expecting.
I have checked the routes using postman of the api server.
I don't have experience with deployment. How do I make the link between the react app and the api server to work?
It is not a good idea to hard code localhost:8080 into your client JS, when your user loads the client files they will try and make a request on your users computer which is what localhost resolves to.
Easiest is to serve your client files from your api server. If you want to keep these separate then you have to use the IP of your API server (not localhost) and setup CORS.
I have a ReactJS project with its own Dockerfile, exposing port 3000:3000.
I also have a PHP project with its own Dockerfile, exposing port 80:80. The PHP app also has containers for MySQL, Redis and Nginx
For the PHP app, I have a docker-compose file that creates a network (my-net) for PHP, Nginx, MySQL and Redis to communicate on. However, I now want the ReactJS (which is in a separate project) to be able to communicate with the PHP app.
I added a docker-compose file to the React project, and added it to the network from the PHP project my-net and declared it as external so that it doesn't try to create it.
This seems to work: From the ReactJS container, I can ping app (the name of my backend service) and it works properly. However, from the ReactJS code, if I use something like axios to try and hit the backend API, it can't resolve app or http://app or any variation. It can however access the underlying IP address if I substitute that into in axios.
So there seems to be some issue with the hostname resolution, and presumably this is on the axios / JavaScript end. is there something I'm missing or a reason this isn't working?
When the JavaScript runs in a browser (outside of Docker) you can not use app because that is only available inside the Docker network (via the embedded DNS server).
To access your PHP server from outside use localhost and the exposed port (80) instead.