Here is my nginx server block where reverse proxy is configured:
server {
root /var/www/portfolio/build;
index index.html;
server_name somesite.com;
listen 443 ssl; # managed by Certbot
ssl_certificate /etc/letsencrypt/live/somesite.com/fullchain.pem; # managed by Certbot
ssl_certificate_key /etc/letsencrypt/live/somesite.com/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.somesite.com) {
return 301 https://$host$request_uri;
} # managed by Certbot
if ($host = somesite.com) {
return 301 https://$host$request_uri;
} # managed by Certbot
#listen 80;
server_name somesite.com www.somesite.com;
return 404; # managed by Certbot
location / {
try_files $uri $uri/ /index.html?q=$uri&$args;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_set_header Host $host;
proxy_http_version 1.1;
proxy_cache_bypass $http_upgrade;
proxy_pass "https://localhost:3000";
this only happens when i go to page, click on the subpage then refresh it --
nginx error log:
2020/11/12 20:32:09 [error] 595#595: *8 open() "/var/www/portfolio/build/portfolios" failed (2: No such file or directory), client: 192.168.1.1, server: somesite.com, request: "GET /portfolios HTTP/1.1", host: "somesite.com"
2020/11/12 20:36:28 [error] 595#595: *15 open() "/var/www/portfolio/build/portfolios" failed (2: No such file or directory), client: 192.168.1.1, server: somesite.com, request: "GET /portfolios HTTP/1.1", host: "somesite.com"
2020/11/12 20:36:30 [error] 595#595: *15 open() "/var/www/portfolio/build/portfolios" failed (2: No such file or directory), client: 192.168.1.1, server: somesite.com, request: "GET /portfolios HTTP/1.1", host: "somesite.com"
Related
I'm trying to host express API in the root route(/) and react app in the app route(/app). If I go to https://<domain> then I can access the express app but if I go to https://<domain>/app then I can't access the react app. It says:
403 Forbidden
nginx/1.14.0 (Ubuntu)
Here is the config file for Nginx:
server {
server_name <domain>;
location /app/ {
root /var/www/html;
index index.html index.htm;
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;
try_files $uri $uri/ /index.html;
}
location / {
proxy_pass https://<ip>:<port>;
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; # managed by Certbot
ssl_certificate /etc/letsencrypt/live/<domain>/fullchain.pem; # managed by Certbot
ssl_certificate_key /etc/letsencrypt/live/<domain>/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 = <domain>) {
return 301 https://$host$request_uri;
} # managed by Certbot
listen 80;
server_name <domain>;
return 404; # managed by Certbot
}
I have api (have use load balance). when I send requests from front-end to back-end, then back-end intermittent receive these requests. This request is show "pending" and the end show:
*"Access to XMLHttpRequest at 'https://frontend.domain.com' from origin 'https://backend.domain.com' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: The 'Access-Control-Allow-Origin' header contains multiple values 'https://backend.domain, ', but only one is allowed."
Although, I have already opened cors in back-end. Below is file config nginx of front-end domain.
config nginx
server {
if ($host = frontend.domain.com) {
return 301 https://$host$request_uri;
} # managed by Certbot
if ($host = frontend.domain.com) {
return 301 https://$host$request_uri;
} # managed by Certbot
listen 80;
listen [::]:80;
access_log off;
server_name frontend.domain.com;
client_max_body_size 20M;
return 301 https://$server_name$request_uri;
}
server {
listen 443 ssl;
server_name frontend.domain.com
client_max_body_size 20M;
ssl off;
ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
ssl_ciphers HIGH:!aNULL:!MD5;
location / {
proxy_pass http://0.0.0.0:3000;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
proxy_http_version 1.1;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header Host $host;
proxy_method GET;
proxy_connect_timeout 6000;
proxy_send_timeout 6000;
proxy_read_timeout 6000;
send_timeout 6000;
client_max_body_size 20M;
}
ssl_certificate /etc/letsencrypt/live/domain.com/fullchain.pem; # managed by Certbot
ssl_certificate_key /etc/letsencrypt/live/domain.com/privkey.pem; # managed by Certbot
}
And addition before I no have, suddenly after I restart the server I have this error.
Any tip to this error goes away. Thanks.
I deployed a web application on an ubuntu server and everything work just fine. Until I installed letsencrypt ssl on nginx reverse proxy suddenly my ReactJS frontend throws net::ERR_SSL_PROTOCOL_ERROR error. What am I doing wrong? Both application run on same server.
server {
root /var/www/html;
# Add index.php to the list if you are using PHP
index index.html index.htm index.nginx-debian.html;
server_name domain.tld www.domain.tld;
location / {
# First attempt to serve request as file, then
# as directory, then fall back to displaying a 404.
#try_files $uri $uri/ =404;
proxy_pass http://localhost:5555;
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/sitedomain/fullchain.pem; # managed by Certbot
ssl_certificate_key /etc/letsencrypt/live/sitedomain/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
#return 301 https://$host$request_uri;
}
server {
if ($host = www.domain.tld) {
return 301 https://$host$request_uri;
} # managed by Certbot
if ($host = domain.tld) {
return 301 https://$host$request_uri;
} # managed by Certbot
listen 80 default_server;
listen [::]:80 default_server;
server_name domain.tld tld;
return 404; # managed by Certbot
}
This is my nginx config file above.
My backend is running on the same server on port 9000.
My frontend loads with https correctly but unable to connect to backend on port 9000 on the same machine.
Note: my frontend is on port 5555 accessible through nginx reverse proxy
I wanted to access one of the react projects as the following instruction.
https://my.domain.com/app1 ==> HTTP://localhost:7001
The following is the Nginx config:
server {
listen 80;
server_name my.domain.com;
return 301 https://$server_name$request_uri;
}
server {
listen 443 ssl;
ssl_certificate /etc/letsencrypt/live/my.domain.com/fullchain.pem;
ssl_certificate_key /etc/letsencrypt/live/my.domain.com/privkey.pem;
ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
ssl_ciphers HIGH:!aNULL:!MD5;
server_name my.domain.com;
error_log /var/log/nginx/my.domain.com.err;
access_log /var/log/nginx/my.domain.com.log;
location /app1 {
proxy_set_header Host $http_host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Scheme $scheme;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
add_header Pragma "no-cache";
add_header Cache-Control "no-cache";
proxy_pass http://localhost:7001/;
proxy_redirect default;
sub_filter_types *;
sub_filter 'action="/' 'action="/app1/';
sub_filter 'href="/' 'href="/app1/';
sub_filter 'src="/' 'src="/app1/';
sub_filter_once off;
}
}
The problem is that some of the source files responded by https://my.domain.com/app1/... but some responded by https://my.domain.com/..., there for the second one is not accessible and gives HTTP 404 error.
For example, the following sources have been responded as HTTP 200:
https://my.domain.com/app1/static/css/main.091g2s3f.chunk.css
https://my.domain.com/app1/static/js/2.29c551h6.chunk.js
And the following is responded as HTTP 404:
https://my.domain.com/media/contact-title.png
https://my.domain.com/static/media/Yekan.05744gh2.woff
https://my.domain.com/logo.svg
Any idea?
Thanks in advance.
What I did and not solved:
I did configure the Nginx rewrite, simple proxy_pass and regex but the problem not solved, in addition, I got all the responses as HTTP 404.
You are only forwarding /app1 to upstream, if u want to forward media and static etc, then you need to change the following
location /app1
to
location /
OR if you are serving them as static files, add the following
location /static {
root /path/to/your/static/path;
}
then you can call all your static files from example.com/static/something.css
i try to run a react application on amazon ec2 instance.when i listen on default port(port:3000) it's running perfectly, but when change the port number from 3000 to 4000 by, it shows 502 gate way error like below.
MY NGINX SETUP:
server {
listen 80 default_server;
server_name MY_DOMAIN;
return 301 https://$server_name$request_uri;
}
server {
listen 443 ssl default_server;
server_name MY_DOMAIN;
ssl_certificate /etc/letsencrypt/live/MY_DOMAIN/fullchain.pem; # managed by Certbot
ssl_certificate_key /etc/letsencrypt/live/MY_DOMAIN/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
location / {
proxy_pass
http://PRIVATE_IP:4000;
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 /server {
proxy_pass
http://PRIVATE_IP:5000;
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;
}
}
GET https://MY_DOMAIN_URL/static/js/6.chunk.js net::ERR_ABORTED 502 (Bad
Gateway)
favicon.ico:1 GET https://MY_DOMAIN_URL/favicon.ico 502 (Bad Gateway)
manifest.json:1 GET https://MY_DOMAIN_URL/manifest.json 502 (Bad
Gateway)
manifest.json:1 Manifest: Line: 1, column: 1, Syntax error.