I built a Node app using this tutorial. Then I built a Node API using this tutorial. The app uses the app on port 4000 to connect to the API which then connects to a mongodb to store the info on the server.
This setup works great on my local machine, but I'm trying to deploy it on a digital ocean droplet. I have Nginx setup to listen to port 8080 for the main app. I'm able to navigate to the app. But when I try to register a user and submit the data to the API I get the following error in my browser OPTIONS http://localhost:4000/users/register net::ERR_CONNECTION_REFUSED.
I suspect I have to specify something in the Nginx config files. Or would it be a ufw issue? Any help would be much appreciated.
The error is very clear. The application try to fetch on localhost:4000, so you expect any visitor of your web app to have the API launched on their own computer.
Change your code to point to the correct host and port of you server.
Then, as you guess it, you will have to create a little Nginx configuration to tell him what to proxy to the APP and what to proxy to the API.
Related
I was working in a project and sudden noticed that while react is calling node api, i can see port number also in console network, which i think is not secure.
So is there any tool, settings whcih we can use to hide ports from api calls.
I am using apache as server, node api and react frontend.
Thanks
Tried virtual host settings but not worked
I feel like I have exhausted all possible searches and documentation trying to figure this out. I have a React native app which runs perfectly locally with a node server with websockets, I will like to know steps on how I could deploy this app to the store. I understand the server has to be hosted for example on heroku, but the workaround of the whole process from local server to heroku, then AppStore still confuses me. I will appreciate any suggestions, or clarification on how I could achieve this(deploying server and connecting to React native). Thanks
Host your Node.js server;
Use the remote server's endpoint on the app;
This can be useful to have a dynamic endpoint (dev and production env):
const endpoint = __DEV__ ? 'http://localhost:8080' : 'https://myServer/';
After your app get published on App Store it will communicate with remote server.
I've always used heroku to deploy my MERN apps. For the mongo db I use MongoDB Atlas, but in my job they want to migrate all the projects to DigitalOcean. I have several questions regarding this:
Can I have mongoDB + nodejs backend + react app on a single
droplet?
Can I deploy two or more apps in a single droplet? (The
apps have different domains)
Is there a video tutorial about this
(I've read lots of documentations and got many errors while trying
to do it. My eyes hurt 🙃)
For example if I have in Heroku two apps for the same website, one app for the nodejs backend and another one for the react frontend... can I do the same on DigitalOcean?
Thanks in advance!
Yeah, you can deploy multiple services in a single server, they just need to be listening on different ports.
For example, let's consider that a MongoDB server is running on port 27017, a Node.js http server is running on port 5000, and a React app is running on port 8000.
Say, your server's IP is 13.13.13.13.
Then you can access your MongoDB server, Node.js http server, and React app using 13.13.13.13:27017, 13.13.13.13:5000, and 13.13.13.13:8000, respectively, from anywhere in the Internet where your IP isn't blocked.
Now, in your server, you set up iptables to forward all incoming connections from port 8000 to 80. Now, you can access your React app by visiting 13.13.13.13, no need to use the port anymore.
Now, let's say, you add DNS records for example.com and api.example.com to point to your IP. And since you can't have A records or CNAME records pointing to a port, both of your domains will direct you to your React app. You'll have to explicitly specify the port number along with your domain if you want to access your Node.js backend, like http://example.com:5000, or http://api.example.com:5000.
If you don't want to access your backend using the port number, you can make use of Nginx as a reverse proxy. You can set up Nginx to route all the traffic to api.example.com to your backend server listening on localhost:5000.
I am an inexperienced intern working with a remote Windows Server and React. The Windows Server is running in the company network. I have created a dynamic React website with a NodeJs backend and React Router. I have only ran it on the localhost development server. I want to try to deploy it on the remote Windows Server and give it a custom domain name (Something which can be accessed like servername/myreactapp/).
So far, I have had no success trying to make it work with IIS, even with a web.config file (I get 404 and 500 errors). I am currently making it work by actually running the development server and the nodejs server in the Windows Server, and I access it through the server IP at port 3000.
An improvement would be to be able to access the port through the server name (like servername:3000, instead of the server_ip:3000), but ideally I want to be able to access it like servername/myreactapp/.
Any help would be appreciated. Thank you very much.
The simple solution would be to run your app on port 80 then you will not have to specify the port number.
The best solution would be to set up Nginx on the server and proxy_pass / route to port 3000.
If its running on localhost, which would be port 80, the url would be like http://your_server_name:80, and would be accessible by anyone on the same network, as long as your authentication allows it.
I think I'm doing something completely the wrong way.
I have an Nodejs server running that read in a DB and serve with express some data via http locally (it has to only be accessed locally). It sends the data on localhost on some port (8080 for example). Then I have an angular app on the server that get these datas from an http request on localhost:8080 and display them. The angular app runs locally on localhost:4200.
I was building the entire stuff on my computer and that was working perfectly (I have no problem with CORS). Then I deployed it on a server, and I accessed it via ssh port forwarding. Basically I forward localhost:4200 on the server via ssh on my local computer on localhost:8090.
And my problem is that, when loading and executing the angular app in my browser via port redirection, it's doing a get request to localhost:8080. So it's trying to communicate with the localhost it's running on, which is the client itself.
If you understood my spaghetti situation, there is actually a dirty solution : redirect localhost:8080 on the server to localhost:8080 on the client.
Is there any way to do the get request server side and not in the client's browser so that localhost correspond to the server? Is there a better way to do what I'm trying to do?
I can sum up by : How can you access another local service on localhost on the server with angular app since it executes in the client browser and localhost will refer to client localhost.
Try to use any web server (such as nginx or apache2 or etc.) in your server and make use of proxy and reverse proxy with your node application, it will work
angular2-router-and-express-integration