i’m new to the javascript world and im trying to publish online a small react app that i‘ve done for tests.
So, first i installed nodejs in my server that already has nginx. Then expressjs, configure it and made a nginx .conf file that uses proxy_reverse to access port 8080 (chosen for nodejs). When i access the server name of that .conf file, without the port, the page it’s shown correctly.
The problem is, if i access another server name configured in my server and add the 8080 port at the end, nginx shows me my nodejs app, even with a server name different from the one configured in proxy_reverse.
Is there any way to limit access to that specific port to one specific server name and return a error everywhere else?
My nginx conf file:
server {
listen 80;
server_name react.mydomain.com;
access_log /var/log/nginx/react.access.log;
error_log /var/log/nginx/react.error.log error;
location / {
proxy_pass https://localhost:8080;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Host $http_host;
proxy_set_header X-NginX-Proxy true;
# Enables WS support
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
proxy_redirect off;
}
}
Thanks
Related
i want to host two small websites, both made with strapi backend and react frontend, on my server which is a digital ocean droplet.
I already configured nginx in order to work for one of the websites and everything is working correctly. I can access strapi from site1.com/dashboard and my queries point to site1.com/api/graphql. I followed some tutorials for that.
Here are the nginx files i added:
/etc/nginx/sites-available/site1.com:
server {
listen 80;
listen [::]:80;
root /var/www/site1.com/react;
# Add index.php to the list if you are using PHP
index index.html index.htm index.nginx-debian.html;
server_name site1.com www.site1.com;
location /api/ {
rewrite ^/api/(.*)$ /$1 break;
proxy_pass http://strapi;
proxy_http_version 1.1;
proxy_set_header X-Forwarded-Host $host;
proxy_set_header X-Forwarded-Server $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_set_header Host $http_host;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "Upgrade";
proxy_pass_request_headers on;
}
location /dashboard {
proxy_pass http://strapi/dashboard;
proxy_http_version 1.1;
proxy_set_header X-Forwarded-Host $host;
proxy_set_header X-Forwarded-Server $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_set_header Host $http_host;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "Upgrade";
proxy_pass_request_headers on;
}
location / {
# First attempt to serve request as file, then
# as directory, then fall back to displaying a 404.
try_files $uri $uri/ /index.html;
}
}
file /etc/nginx/conf.d/upstream.conf:
upstream strapi {
server 127.0.0.1:1337;
}
What i now want to do is to deploy another website to the same server and configure nginx to serve it as well (on another domain, for example site2.com).
So i added the nginx virtual server file for the second website, copying the first one and changing the domain name and root directory.
The site 2 frontend is now working correctly and accessible on its domain.
However when i start the site 2 strapi instance it says the port 1337 is already in use (obviously, it is used by site 1 strapi instance that is running with pm2). So i changed the port in strapi config to be 1338 (is it ok?) but now i don't know what do to in nginx in order to serve the two different strapi instances on different domains.
The hostname you are using for the proxy_pass directive is the upstream name you defined in the separate config file. This is basically an indirection to one or more real backends. In your case that's the application running on port 1337 on the same machine. It could also be a list of external domains where nginx takes care to distribute the load to.
Your approach with additional virtual hosts already looks good. The frontend that already "works" under site2 is probably the old instance served under the new domain if your proxy_pass directive still points to http://strapi for site2 (which probably still resolves to `localhost:1337).
As you already mentioned, a second instance of the backend needs to run on a different port. The port number you use is not really important as you will control this with your upstream configuration. Just make sure to not use a port number below 1024 (which requires root permissions), don't conflict with other processes on the system (you will notice) and as best practice, don't use port numbers that are default for some other protocols (maybe check this list).
To fix your setup, just define a second upstream like the first one but pointing to the new url e.g. localhost:1338 and then reference this new name in the proxy_pass directive of site2.
Technically, with just one backend per upstream, you could also skip the upstream part completely and reference the URL directly in the proxy_pass directives, but using a shorthand name can also support readability of your configuration.
I have been searching for this answer for months and have never been able to resolve this. I am using nginx as my web server and using node.js for my backend apis and vue as my main front end webpage that uses webpack. I would like to be able to go to my Vue page by going to http://ip and then get access to the api services by going to http://ip/api. I dont have a domain name set up so I use IP address for the urls.
So far I built my Vue app and is sitting in the /var/www/html/Web/dist folder and it works if you go to the http://ip url but I can not access my node.js APIs. My node.js server is running on localhost port 3000. My nginx config looks like this:
server {
listen 80;
root /var/www/html/Web/dist;
}
server {
listen 80;
location /api/ {
proxy_pass http://localhost:3000;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_cache_bypass $http_upgrade;
}
}
You are duplicating server configuration. Simply keep one server properties set :
server {
listen 80;
root /var/www/html/Web/dist;
location /api/ {
proxy_pass http://localhost:3000;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_cache_bypass $http_upgrade;
}
}
That means :
listens to all request for all ip's on port 80
Evaluate relative path from root /var/www/html/Web/dist;
if there's a matching '/api/' in url pass it to localhost:3000
It should work as expected now
I have 2 server:
Server 1 is for loading balance with Nginx - https://server1.herokuapp.com/
Server 2 is for acting RESTful APIs. - https://server2.herokuapp.com/
Here my configuration of nginx.conf.erb at Server 1: https://gist.github.com/ntvinh11586/5b6fde3e804482aa400f3f7faca3d65f
When I try call https://server1.herokuapp.com/, instead of return data from https://server2.herokuapp.com/, I reach a 400 - Bad request. I don't know somewhere in my nginx.conf.erb wrong or I need implement nginx in server 2.
Try to research some resources but I found almost these tutorials configuring in localhost instead of specific hosts like heroku.
So what should I do to make my work successfully?
You need to configure your app as follows -
#upstream nodebeats {
# server server2.herokuapp.com;
# }
server {
listen <%= ENV['PORT'] %>;
server_name herokuapp.com;
root "/app/";
large_client_header_buffers 4 32k;
location / {
proxy_redirect off;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_set_header Host $http_host;
proxy_set_header X-NginX-Proxy true;
proxy_set_header Connection "";
proxy_http_version 1.1;
proxy_pass http://localhost:<node-app-port>;
}
My two cents.
Comment out the upstream. Work with a single server server1.herokuapp.com, get it working with the above implementation, and then you can accomplish on adding the server2.hreokuapp.com to load balance.
I have a private messaging app built with nodejs and socketio which works in the url http://localhost:3000
I'm wondering how would I integrate it in a dedicated server like Amazon's EC2? I can understand that it will work on http://someip:3000 but I want the chat application to work inside a website, just like facebook. How do I set it up to work on all website pages?
Thank you
Basically you need a web server to proxy your app in the port 80 (http), this is a basic configuration for Nginx where the node app running in 127.0.0.1:3000 will be proxied to the port 80 of www.example.com that should point to the EC2 public IP:
upstream node {
ip_hash;
server 127.0.0.1:3000;
}
server {
server_name www.example.com;
access_log /var/log/nginx/www.example.com-access.log main;
error_log /var/log/nginx/www.example.com-error.log warn;
listen 80;
location / {
## Socket.io
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
## End Socket.io
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
#proxy_set_header Host $http_host;
proxy_set_header Host $host;
proxy_set_header X-NginX-Proxy true;
proxy_pass http://node;
proxy_redirect off;
proxy_max_temp_file_size 0;
}
}
I run my node app on localhost:3000 and it is serving a default page for the route /. If I access http://localhost:3000 the default page is displayed accordingly. I have also running a Nginx server that is basically configured as followed:
server {
listen 80;
server_name localhost;
location /node_app {
proxy_pass http://127.0.0.1:3000;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
}
If I run http://localhost/node_app now, my node app throws an error saying that it cannot find route /node_app.
How can I configure either my node app or the nginx server in a way that I can access the app by calling http://localhost/node_app, yet the app itself thinks it is at /?
Update
If I add a / to http://127.0.0.1:3000 it is actually matching /node_app to the / route. But now every stylesheet for instance within the default page is now pointing to the wrong path.
After experimenting a bit around I finally got the configuration right to work exactly how I wanted the server to work:
server {
location /node_app/ {
proxy_pass http://localhost:3000/;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
}
Lesson learned: Remember the slashes!