I have a server on DigitalOcean that hosts my web app.
The server hosts the API (using Flask) and my web app (React).
I managed to set up the Nginx to serve the app and the API using 2 different domains.
Now I'm facing a problem.
I'm, trying to add another domain that I need to be able to access only one page in the react app.
I can't find a way to set up the configuration to allow that.
server {
server_name www.domain domain;
root /var/www/path/html;
index index.html index.htm index.nginx-debian.html;
location / { deny all; }
location = / { }
location /test {
try_files $uri /index.html;
}
location /favicon.ico {
try_files $uri /index.html;
}
location /static/ {
try_files $uri /index.html;
}
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 }
In my other config files I just use try_files $uri /index.html; and it works perfectly.
I need this domain to be able to accept requests for one path only (domain.com/confirm/token)
Related
I am trying to configure NGINX to serve two separate websites on the same domain, with one of the websites being served at the top level of the domain, and the other accessible from domain.com/gol
The first websites files are on the server located at /var/www/morderindustries.com/public
The second websites files are on the server located at /var/www/morderindustries.com/gol
This is my nginx config for the website:
server {
listen 443 ssl default_server;
listen [::]:443 ssl default_server;
ssl on;
ssl_certificate /etc/ssl/ssl-bundle.crt;
ssl_certificate_key /etc/nginx/ssl-certs/www.morrder.com.key;
server_name morrder.com www.morrder.com;
# index index.html
error_log /var/log/nginx/morderindustries.com.error.log;
access_log /var/log/nginx/morderindustries.com.access.log;
location / {
root /var/www/morderindustries.com/public;
try_files $uri $uri/ /index.html =404;
}
location /gol {
root /var/www/morderindustries.com/gol;
try_files $uri $uri/ /index.html =404;
}
error_page 404 /404.html;
# redirect server error pages to the static page /50x.html
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root /var/www/morderindustries.com/public;
}
}
With this setup, https://morrder.com works fine and serves the website that is located in the /public folder.
I expect https://morrder.com/gol to serve the second website in the /gol folder, but the result is the following:
Does anyone have a clue as to what I've screwed up?
Using static /var/www/reactappsbuildhere works fine for
thismydomain.com with React router dom link to thismydomain.com/contact Works
but not thismydomain.com/contact directly into url will get error 404 not found
For example, I build an app using react js put into /var/www
domain.com/contact
in NGINX getting error 404 for https://thismydomain.com/contact
but work fine for domain.com (enter thismydomain.com/contact works fine) but if i refresh it become 404
server {
server_name thismydomain.com;
root /var/www/thismydomain;
index index.html;
location / {
try_files $uri $uri/ =404;
}
listen [::]:443 ssl ipv6only=on; # managed by Certbot
listen 443 ssl; # managed by Certbot
ssl_certificate /etc/letsencrypt/live/thismydomain.com/fullchain.pem; # managed by Certbot
ssl_certificate_key /etc/letsencrypt/live/thismydomain.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 = thismydomain.com) {
return 301 https://$host$request_uri;
} # managed by Certbot
listen 80;
listen [::]:80;
server_name thismydomain.com;
root /var/www/mydomain;
return 404; # managed by Certbot
}
I am deploying my code onto a nginx server from Jenkins I have being following this process for a few months. There is a build script on my server box that a job configured in Jenkins picks up to know when pull down my latest changes and re build. In my nginx configuration looks like below. So you see currently getting the build folder in my root. And my build script just cp /var/www/example , npm run build, and nginx restart . Like I know the issue but Im getting confused on the proper steps to take because nginx shouldn't be getting my build folder while this script is running which is the reason im seeing 500 internal server errors whenever i run the Jenkins job.
server_name example.com www.example.com;
#return 301 https://$host$request_uri;
#ssl_certificate /etc/letsencrypt/live/example.com/fullchain.pem; # managed by Certbot
#ssl_certificate_key /etc/letsencrypt/live/example.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
root /var/www/example/build/;
index index.html;
add_header Strict-Transport-Security "max-age=31536000; includeSubDomains" always;
location / {
try_files $uri $uri/ /index.html;
}
location ~* \.(jpg|jpeg|png|gif|ico|css|js|eot|ttf|woff|woff2)$ {
expires max;
add_header Cache-Control public;
add_header Access-Control-Allow-Origin *;
access_log off;
try_files $uri $uri/ /index.html;
}
I am using a React app as frontend and a Laravel app for backend. These two are connected with each other through Laravel Sanctum APIs. The whole environment is deployed on the server using Docker, frontend & backend being separate containers, but connected with network: someNetwork
The API call is done from the frontend using the URL HTTP://myserverip:8000 - this is working, but I would like to close the 8000 port (externally) and just keep open the 3000 port where the frontend is working. Now when I'm closing the 8000 port (with firewall), and trying to make API request from frontend I get a network error.
The question is, how to make the API request internally so I can keep only 3000 open, do I need some kind of redirection inside the .conf file of the nginx? This is my .conf file:
server {
listen 80;
index index.php index.html;
error_log /var/log/nginx/error.log;
access_log /var/log/nginx/access.log;
root /var/www/public;
location ~ \.php$ {
try_files $uri =404;
fastcgi_split_path_info ^(.+\.php)(/.+)$;
fastcgi_pass app:9000;
fastcgi_index index.php;
include fastcgi_params;
fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
fastcgi_param PATH_INFO $fastcgi_path_info;
}
location / {
try_files $uri $uri/ /index.php?$query_string;
gzip_static on;
}
}
Thanks, any hint would be appreciated.
What you are trying to do will never work.
ReactJS (I guess thats what you mean by ReactApp) should be "build" before used in production. The result will be a build folder with a bunch of static files.
These files can be deployed / serverd using NGINX. The API-Calls from ReactJS (your Frontend App) will always come from outside of your network as the client / customer will not be part of your Docker NAT network (I guess).
I would use NGINX as a Webserver for your ReactApp (ReactJS Build) as well as a reverse Proxy / Proxy for your Laravel Backend.
Something like:
server {
listen 443 ssl;
server_name example.com
.....
root /path/to/your/reactapp/static/files;
location / {
try_files $uri /index.html;
}
}
server {
listen 443 ssl;
server_name api.example.com;
...all the laravel PHP config here
}
if you can not or want not create a subdomain for your API use a location
server {
listen 443 ssl;
server_name example.com
.....
root /path/to/your/reactapp/static/files;
location / {
try_files $uri /index.html;
}
location /api/ {
Do your Laravel config here (use nested locations for handling the php files)
Or do a `proxy_pass` and configure an internal server (listen `8000`) and do not expose it.
}
}
in my react app I've been struggling with a bug that made a map the wrong size on the page. After solving the bug yesterday I've been trying to make the solution work on my server. Using Ubuntu 16.04 with Nginx as the webserver serving my /build folder. I tried 'hard resetting' the page by deleting the entire website folder from /var/www, re-cloning from githug and running yarn build again, how ever the bug is still present; but not present in localhost.
My nginx config
server {
root /var/www/<sitepath>/build;
server_name <siteurl .;
index index.html index.htm;
location / {
try_files $uri /index.html;
auth_basic "This site is under development";
auth_basic_user_file /etc/nginx/.htpasswd;
}
location ~* \.(?:manifest|appcache|html?|xml|json)$ {
expires -1;
}
location ~* \.(?:css|js)$ {
try_files $uri =404;
expires 1y;
access_log off;
add_header Cache-Control "public";
}
listen 443 ssl; # managed by Certbot
ssl_certificate <pempath>; # managed by Certbot
ssl_certificate_key <pempath>; # managed by Certbot
include /etc/letsencrypt/options-ssl-nginx.conf; # managed by Certbot
ssl_dhparam <pempath>; # managed by Certbot
}
server {
if ($host = <mysite>) {
return 301 https://$host$request_uri;
} # managed by Certbot
if ($host = <mysite>) {
return 301 https://$host$request_uri;
} # managed by Certbot
listen 80;
server_name <mysite>;
return 404; # managed by Certbot
}
The rest of the site seems to be working fine, I'm only using nginx as my webserver, no node is being used. I've tried using chrome incognito mode and tested on laptops that have never opened the page before, but the bug is still present. The app was made using create-react-app, I have not ejected the create-react-app. for running the app localhost I've been using yarn run
site on the server:
site on server
site on localhost
site on localhost
I'd be happy to post any additional config or code that may help solving this issue.
edit:
I've tried doing the same process with deleting the website folder and re-cloning localhost to see if the issue was present then, it was not.