Here is my Nginx configuration and it's not working.
server {
listen 80;
server_name mydomain.com;
location /path {
proxy_pass http://localhost:3000;
}
}
However, reverse proxy in location / is working. I think this is related to Nuxtjs but can't find a solution.
If you are using nuxt, you shouldn't serve as a proxy pass.
You should use the following command to generate a build and serve the path with nginx. For more information you can check the nuxt docs
$ npm run build
$ npm run generate
After that command run with success you should see a new folder dist with your project.
You should serve dist folder in your nginx.
My nginx file example for serving nuxt project:
server {
listen 80 default_server;
root /var/www/site/dist;
index index.html;
server_name mydomain.com.br www.mydomain.com.br;
location / {
try_files $uri $uri/ =404;
}
location /path {
alias /var/www/nuxtproj/dist; #<-- made this edit
try_files $uri $uri/ =404;
}
}
Related
I have a trouble serving under the same domain more than one React already built app( so in fact just a static files)
I have a config like below
server {
listen 80;
listen [::]:80;
root /var/www/xxx.xxx.xxx.xx; <IP
location /portfolio {
try_files /portfolio$uri /portfolio$uri/ =404;
}
location /portfolio2 {
try_files /portfolio2$uri /portfolio2$uri/ =404;
}
}
under the path > /var/www/xxx.xxx.xxx.xx i have 2 folders portfolio and portfolio2 which have build react code inside of each path
Thx a lot for response
I have my ReactJS NodeJS deployed on Linux NGINX and I can login on my development machine, on my phone, and on Linux OS running on my computer Oracle VM; i can accessed the application on these devices and it worked fine on these three devices even when I changed IP address but immediately another device e.g somebody else computer or phone tries to login, it would always return invalid login credentials but my three devices(laptop, phone, and Linux OS running on my computer Oracle VM) can login successfully on this application.
Below is my nginx.conf that manages my ReactJS NodeJS application
user www www; ## Default: nobody
server { # simple reverse-proxy
listen 80;
server_name mydomain;
root /etc/nginx/sites-available/mydomain;
index index.html;
# serve static files
#location ~ ^/(images|javascript|js|css|flash|media|static)/ {
location / {
# First attempt to serve request as file, then
# as directory, then fall back to displaying a 404.
try_files $uri /index.html $uri/ =404;
}
location /api {
proxy_pass https://localhost:port;
}
}
server {
listen 443 ssl;
server_name mydomainname
root /etc/nginx/sites-available/mydomain;
index index.html;
location / {
# First attempt to serve request as file, then
# as directory, then fall back to displaying a 404.
try_files $uri /index.html $uri/ =404;
}
location /api {
proxy_pass https://localhost:port;
}
ssl_certificate /etc/letsencrypt/live/mydomain/fullchain.pem; # managed by Certbot;
ssl_certificate_key /etc/letsencrypt/live/mydomain/privkey.pem; # managed by Certbot
ssl_verify_client on;
}
I will appreciate your help.
I am trying to run a react app with Node.js backend on the Nginx server.
Here's my server block in the nginx.conf file:
include /etc/nginx/conf.d/*.conf;
server {
listen 80;
listen [::]:80;
server_name _;
root /usr/share/nginx/folder-name/frontend/build;
index index.html index.htm;
location / {
proxy_pass http://localhost:5000;
}
# Load configuration files for the default server block.
include /etc/nginx/default.d/*.conf;
error_page 404 /404.html;
location = /40x.html {
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
}
}
The build folder contains the compiled react js code(using npm run build)
Node.js backend is running on port 5000 using pm2/forever.
After restarting the Nginx Server, the react UI appears on the server IP but the UI is distorted.
Also, I am not able to access my backend APIs on MyIP/api/endpoint.
What am i doing wrong.? This nginx configuration was built from SO and other online resources so there's a huge probabilty that it could be wrong. Please help!
Thanks in advance!
The issue is you are setting the API proxy for the root (/). The correct one should look like this:
server {
listen 80;
listen [::]:80;
server_name _;
root /usr/share/nginx/folder-name/frontend/build;
index index.html index.htm;
location /api {
proxy_pass http://localhost:5000;
}
location / {
try_files $uri $uri/ =404;
}
}
If you don't have /api path in your Node.js, you will need a rewrite rule for it like this:
location /api {
rewrite ^/api/?(.*) /$1 break;
proxy_pass http://localhost:5000;
proxy_redirect off;
proxy_set_header Host $host;
}
I had experience that.Please check my image file
This configuration is running successfully on aws.
Your mistakes is proxy area. Please change like that.
location /api/ {
proxy_pass http://127.0.0.1:5000/api/
}
If you want, I can HELP you.
Yes, you can host both API and static files (build files of your front-end) on the same domain or host. Below, you can find a server block for a sample API hosted on port 3000 and static HTML files at a root location being served on port 80.
server {
listen 80;
server_name localhost;
location / {
root /var/www/html;
index index.html;
error_page 404 index.html;
}
location /api/ {
proxy_pass http://localhost:3000/;
}
}
You can access the front-end at http://localhost/<blah...> and the API at http://localhost/api/<blah...> (please note how /api is handled in the URL here and the server block above). Replace localhost with your domain name.
What am i doing wrong.?
One issue is with your proxy_pass directive. You are missing trailing slash /
...
location / {
proxy_pass http://localhost:5000/;
}
...
First, try this and share your result.
I have a server where I have an Angular app and a nodejs backend.
The backend runs on port 4000
I use nginx as reverse proxy and here is my config
server{
server_name _;
location / {
root /var/www/haymrFront;
index index.html;
try_files $uri $uri/ /index.html;
}
location /tgup-api/ {
proxy_pass "http://localhost:4000/";
}
}
Unfortunately when I send a request to my server/tgup_api/, the angular app gets it. Any idea how to fix it?
you don't need quotes for proxy_pass
just use
location /tgup-api/ {
proxy_pass http://localhost:4000/;
}
I have configured nginx server on my system, server was successfully configured and running well.
one/single node application running well
but multiple application not running!!!
I am running multiple node application
like:
"test1"
http://127.0.0.1:3000
"test2"
http://127.0.0.1:3001
"test3"
http://127.0.0.1:3002
in /etc/nginx/sites-available/
server {
listen 80 default_server;
location / {
proxy_pass "http://127.0.0.1:3000";
try_files $uri $uri/ =404;
}
}
working well for one site.
but when i added on that file for multiple sites
server {
listen 80 default_server;
location /test1{
rewrite ^/test1(.*) $1 break;
proxy_pass "http://127.0.0.1:3000";
try_files $uri $uri/ =404;
}
}
but i got 500 Internal Server Error