I am getting this error when I try and load my site:
Reading into it, I think there is an issue with my frontend not being able to contact my backend. I've done a CURL to my backend inside the server and outside and everything works. Also deploying with Ember-Cli-mirage works fine as well, Leading me to believe there is an issue with my NGINX config files. I have two config files one for the front end and one for the backend:
Frontend Ember config:
server {
listen 80 default_server;
listen [::]:80 default_server ipv6only=on;
root /usr/local/t;
index index.html;
location / {
try_files $uri $uri/ /index.html;
}
}
My backend Node.js Express config:
server {
listen 80;
server_name default_server;
root /usr/local/cloudBackend;
index index.html index.htm;
access_log /var/log/nginx/cpe.access.log;
error_log /var/log/nginx/cpe.error.log notice;
# auth_basic "Restricted";
# auth_basic_user_file /etc/nginx/.htpasswd;
location / {
proxy_pass http://localhost:3001;
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;
}
}
Any help would be much appreciated.
Added this to my Node.js headers and then it worked!
res.setHeader('Content-Type', 'application/json');
Related
I've seen similar questions around and tried different solutions but none seems to work for me, so I guess I have something wrong in my nginx configurations file.
I have configured nginx to redirect all request to port 8080 except for some locations as I have a nodejs app running on 8080 besides a php application running on port 80 (and another nodejs app service running on 8090) all on the same server (I know it's a weird configuration but I have to live with it for the moment). In my nodejs application I'm tryin to detect if the connection is over http or https but it doesn't work.
I alway get the following regardless I connect over http or https:
console.log(req.headers["x-forwarded-proto"]); // => undefined
console.log(req.secure); // => false
here is my nginx config file:
server {
listen 80 default_server;
listen [::]:80 default_server;
listen 443 ssl;
ssl_certificate /etc/nginx/ssl/server.chained.crt;
ssl_certificate_key /etc/nginx/ssl/server.key;
ssl_protocols TLSv1.2;
root /var/www/html;
index index.html index.htm index.php index.cgi;
fastcgi_buffers 8 16k;
fastcgi_buffer_size 32k;
client_max_body_size 100M;
client_body_buffer_size 128k;
server_name factory.quiddis.com;
location / {
proxy_pass http://localhost:8080;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_set_header X-Forwarded-Ssl on;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_cache_bypass $http_upgrade;
}
location /bugzilla {
try_files $uri $uri/ /index.cgi$is_args$args;
}
location /bugzilla/rest {
rewrite ^/bugzilla/rest/(.*)$ /bugzilla/rest.cgi/$1 last;
}
...
Note:
Although I know I could redirect http to https via nginx, I cannot do it here as the second nodejs app has to stay over http for the moment.
I have a server running with pm2 that is being served up by nginx. I would like to point my react app to the domain, and have the server only respond to requests that the client sends.
currently if you go to jwcuisine.io it gives you a "CANNOT GET /" message, I tried something like this:
location / {
# This would be the directory where your React app's static files are stored at
root /var/www/html/;
try_files $uri /index.html;
}
location /graphql {
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-NginX-Proxy true;
proxy_pass http://localhost:5000/;
proxy_ssl_session_reuse off;
proxy_set_header Host $http_host;
proxy_cache_bypass $http_upgrade;
proxy_redirect off;
}
However, the above ^^^ led to a 500 error from nginx.
Below is the code I currently have, that is giving the /GET response. Any direction would be appreciated, I can't find a ton of relevant information pertaining to this.
server {
server_name jwcuisine.io www.jwcuisine.io;
location / {
proxy_pass http://localhost:4000; #whatever port your app runs on
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;
}
listen [::]:443 ssl ipv6only=on; # managed by Certbot
listen 443 ssl; # managed by Certbot
ssl_certificate /etc/letsencrypt/live/jwcuisine.io/fullchain.pem; # managed by Certbot
ssl_certificate_key /etc/letsencrypt/live/jwcuisine.io/privkey.pem; # managed by Certbot
include /etc/letsencrypt/options-ssl-nginx.conf; # managed by Certbot
ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem; # managed by Certbot
}
server {
if ($host = www.jwcuisine.io) {
return 301 https://$host$request_uri;
} # managed by Certbot
if ($host = jwcuisine.io) {
return 301 https://$host$request_uri;
} # managed by Certbot
listen 80 default_server;
listen [::]:80 default_server;
server_name jwcuisine.io www.jwcuisine.io;
return 404; # managed by Certbot
}
I am also using similar architecture to host my website front-end and back-end via nginx reverse proxy server. There is an update in your nginx conf after which it will work as expected. That is you need to add first all subroutes(Ex. /api, graphql) and then you need to add the location for index route /. In your current conf website will never be able to go to server as /server route gets matched to index route / first and it will try to find it in the static folder and never reach the proxy_pass you have provided in below location.
Update nginx.conf:
server{
listen 80 default_server;
listen [::]:80 default_server;
server_name jwcuisine.io www.jwcuisine.io;
location /graphql {
proxy_pass "http://127.0.0.1:5000";
proxy_read_timeout 5400s;
proxy_send_timeout 5400s;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_cache_bypass $http_upgrade;
}
location / {
root /var/www/html;
try_files $uri $uri/ /index.html;
}
}
Frustrating question here. I have a react project created with created-react-app on a server that has to use Nginx for external connection/HTML server. What essentially I need to do is use nginx as a proxy server and when the URL is typed into browser, the request is routed to localhost:3000 and the react app generates the result which is served to the client by nginx.
So, here is the nginx file so far, but I can't get it to work. A number of questions:
does the root designation need to be directed to the /public directory in the react project to pick up index.html?
Assuming that you run npm start and after the compile, you enter the FQDN in the browser and it routes to localhost:3000
My Nginx config so far
server_name server-name.com;
listen 443 ssl;
ssl_certificate /etc/letsencrypt/live/site-name/fullchain.pem;
ssl_certificate_key /etc/letsencrypt/live/site-name/privkey.pem;
ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
ssl_ciphers HIGH:!aNULL:!MD5;
proxy_read_timeout 60s;
client_max_body_size 64M;
# should this be routed to /public in the react project to pick up index.html?
# root /var/www/html;
index index.html index.htm;
location / {
#try_files $uri $uri/ =404;
# Make sure React Application return is index.html so client routing remains in sync/reachable
#try_files $uri /index.html;
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;
}
location /_api {
rewrite ^/_api/(.+) /$1 break;
include uwsgi_params;
uwsgi_pass 127.0.0.1:3030;
}
}
server {
server_name server-name.com
listen 80;
allow 10.0.0.0/16;
deny all;
proxy_read_timeout 60s;
client_max_body_size 64M;
# Should this be routed to /public in the react project to pick up index.html?
# root /var/www/html;
index index.html index.htm;
location / {
#try_files $uri $uri/ =404;
# Make sure React Application return is index.html so client routing remains in sync/reachable
try_files $uri /index.html;
}
location /_api {
include uwsgi_params;
uwsgi_pass 127.0.0.1:3030;
}
}
open your nginx file vi sites-enabled/default if you don't know how to do that let me know.
then remove everything from that file and simply paste :
server {
listen 80;
client_max_body_size 10M;
server_name YourWebsiteNameWithDomain yourIPV4;
location / {
proxy_pass http://127.0.0.1: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;
}
}
don't forget to restart your nginx
I've hosted my first Vue and Node app but I have a problem. I want to load Vue files on diferent port so there is less stress on node. The problem is that with this current configuration I get this in browser: Cannot GET / even though when in Node router I add route with url / I get something. But I need to load this url from vue router not from express router. Why it loads from express ? This is my configuration file nginx:
server {
listen 80;
listen [::]:80 default_server;
return 301 https://$host$request_uri;
}
server {
# Enable HTTP/2
listen 443 ssl http2;
listen [::]:443 ssl http2;
server_name domain.com;
# Use the Letā€™s Encrypt certificates
ssl_certificate /etc/letsencrypt/live/domain.com/fullchain.pem;
ssl_certificate_key /etc/letsencrypt/live/domain.com/privkey.pem;
# Include the SSL configuration from cipherli.st
include snippets/ssl-params.conf;
location /api {
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-NginX-Proxy true;
proxy_pass http://localhost:5000;
proxy_ssl_session_reuse off;
proxy_set_header Host $http_host;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
proxy_cache_bypass $http_upgrade;
proxy_redirect off;
}
location / {
root /var/www/html/Web/dist; // Vue dist folder
}
}
In your nginx config you need to add try_files $uri $uri/ /index.html; to you / location like so. This sends everything to your index.html file.
location / {
root /var/www/html/Web/dist; // Vue dist folder
try_files $uri $uri/ /index.html;
}
I have a nodejs express app deployed using ecs single container works fine. Now i need to serve the static files of the nodejs app using nginx proxy.
How do I specify the root of the nginx in a multicontainer environment on ECS?
upstream cms_node_server_dev {
server marketing-site-container:3000;
keepalive 64;
}
server {
listen 80 default_server;
listen [::]:80 default_server;
index index.html index.htm index.nginx-debian.html;
root '/home/ubuntu/cms/dev/static-website/public';
location /{
try_files $uri #cms_node_server_dev;
}
location #cms_node_server_dev {
proxy_redirect off;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header Host $host;
proxy_http_version 1.1;
proxy_pass http://cms_node_server_dev;
}
error_page 404 = /404;
}