Nginx cache some location(static files) from another reverse proxy location - web

I have backend web-application working on 8081 port. It is Java spring boot application like uber-jar. So, static files placed into jar file. I have nginx as frontend. And I want to setting up cache static files on frontend. I thought what it is something like this:
proxy_cache_path /tmp levels=1:2 keys_zone=my_cache:10m max_size=10g
inactive=60m use_temp_path=off;
server {
listen 80;
server_name site.ru;
location /my_app {
proxy_pass http://127.0.0.1:8081;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header Host $http_host;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
location ~ /my_app/.+\.css {
proxy_pass http://127.0.0.1:8081;
proxy_cache my_cache;
proxy_cache_valid 200 1d;
}
}
... but it is not working. I believe what I on right way, though a little bit wrong

Related

nginx throws 404 on redirecting through proxy_pass to nodejs app

I'm serving multiple nodejs apps on a single server through pm2 and using nginx to manage reverse proxies. Right now if I use the server's ip and app port to reach the apps directly it all works fine. But if I try to navigate to my apps through the location paths set in the nginx config then I get 404 errors.
Below is my nginx default config:
upstream frontend {
server localhost:3000;
}
upstream backend {
server localhost:8000;
}
server {
listen 443 ssl;
server_name <redacted>;
ssl_certificate <redacted>.cer;
ssl_certificate_key <redacted>.key;
error page 497 301 =307 https://$host:$server_port$request_uri;
location /app/frontend {
proxy_pass http://frontend;
proxy_redirect off;
proxy_set_header Host $host:$server_port;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Ssl on;
}
location /api {
proxy pass http://backend;
proxy_redirect off;
proxy_set_header Host $host:$server_port;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Ssl on;
}
}
server {
listen 80;
server_name <redacted>;
return 301 https://$server_name$request_uri;
}
Now when I try to go to https://<server ip>:3000, the frontend loads just fine but if I go to https://<server ip>/app/frontend, I get the following 404 error:
Although the index.html loads up, it tries to find the static assets on https://<server ip>/ but rather should try to find them on https://<server ip>:3000. This is the exact behaviour that I'm trying to achieve.
What I have tried so far:
Using rewrites
Adding trailing slashes to both location path and proxy_pass
I know this can be solved by changing the app's base url or the build directory but that is not what I'm looking for.
Any help would be highly appreciated.

nginx subdomain configuration example.com/blog

I've spent all day yesterday and today learning how nginx works and I got two different domains working, one with Ghost blogging platform and a static page (future NodeJS app), now I'm trying to setup the subdomain, but I'm kind of frustrated because I feel like I'm almost there but it's not working... This is my current setup:
#Main Domain
server {
listen 80;
listen [::]:80;
server_name example.com;
root /var/www/portfolio;
index index.html;
location / {
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header Host $http_host;
# proxy_pass http://127.0.0.1:2222;
}
location ~ /.well-known {
allow all;
}
client_max_body_size 50m;
}
#Sub domain
server {
listen 80;
listen [::]:80;
server_name example.com/blog;
root /var/www/ghost/system/nginx-root;
location / {
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header Host $http_host;
proxy_pass http://127.0.0.1:2368;
}
location ~ /.well-known {
allow all;
}
client_max_body_size 50m;
}
The idea is to create mysite.com/blog where eventually mysite would be a nodejs app, prob linking the route later will be another problem but... one at a time lol, how can I establish that subdomain?
If I separate the config file into a separate file, I would get the other domain working :/
Thanks
EDIT: I've found that with bucket in S3 on AWS I could acomplish that, but now I don't need it for what I'm doing jeje, but it's good to know.
First: it's not a subdomain, but a subfolder called blog.
If you want to run two apps where one appears in a subfolder, you could do the following
Define two upstreams / proxy pass them to different ports the
Have them in the same config file then
Have two location blocks (location / and location /blog)
Does that make sense? Otherwise one will probably shadow the other.
Note: This is not a complete answer, you probably will need to tinker a bit
As #Jonathan mentioned, from nginx's point of view this is the same site, but you need nginx to handle both locations differently.
Here's how it would look like
server {
listen 80;
listen [::]:80;
server_name example.com;
root /var/www/portfolio;
index index.html;
client_max_body_size 50m;
location / {
# your normal location settings
}
# your blog is defined here
location /blog {
root /var/www/ghost/system/nginx-root;
# You'll probably need to do a rewrite here, because a
# /blog/article needs to be passed as `/article` to the
# app server
# rewrite ^/blog/(.*) $1;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header Host $http_host;
proxy_pass http://127.0.0.1:2368;
}
}
}

Node Application structure for subdomains

I am looking at building a website using node however my idea would be best with the use of subdomains. What i wanted to know is do i need to run each subdomain as a separate app and point to them with nginx?
Current Structure
- client
-- assets
--- js
--- css
--- img
- server
-- app
--- home
--- subapp1
--- subapp2
-- node_modules
-- server.js
-- config.js
The above structure is the thought that each app will run ny itself however they have common views that should be shared. Server.js will run them all. I just need to know if this is correct structure and if there is any cleaner or better alternative. Thanks
I'd suggest setting up Nginx to reverse proxy to 2 NodeJS apps. Run 1 app on port 8081 for example (service1) and the other on 8082 (service2) like this:
upstream service1 {
ip_hash;
server localhost:8081;
}
upstream service2 {
ip_hash;
server localhost:8082;
}
server {
listen 0.0.0.0:80;
server_name service1.mydomain.com;
location / {
index index.html index.htm;
proxy_pass http://service1;
proxy_redirect off;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
}
server {
listen 0.0.0.0:80;
server_name service2.mydomain.com;
location / {
index index.html index.htm;
proxy_pass http://service2;
proxy_redirect off;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
}

How do you serve static files from an nginx server acting as a reverse proxy for a nodejs server?

My current nginx config is this:
upstream nodejs {
server 127.0.0.1:3000;
}
server {
listen 8080;
server_name localhost;
root ~/workspace/test/app;
index index.html;
location / {
proxy_pass http://nodejs;
proxy_set_header Host $host ;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
}
I'm very very new to nginx, but at the very least I know that nginx is better than node/express at serving static files. How can I configure the server so that nginx serves the static files?
I solved it using this new configuration:
upstream nodejs {
server localhost:3000;
}
server {
listen 8080;
server_name localhost;
root ~/workspace/test/app;
location / {
try_files $uri #nodejs;
}
location #nodejs {
proxy_redirect off;
proxy_http_version 1.1;
proxy_pass http://nodejs;
proxy_set_header Host $host ;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
}
Thanks to the following Stack Overflow post:
How to serve all existing static files directly with NGINX, but proxy the rest to a backend server.
You'll probably want another location block within your server for the static files.
location /static {
alias /path/to/static/files;
}
This uses the alias directive.
Then you can hit files at localhost:8080/static/some_file.css
P.S. You don't need the root or index that you have set currently.
(root is similar to alias with a slight difference in usage)

Nginx, Node, Angular - Subfolder API/URL configuration

I currently have a node/angular app that runs as expected when pointed directly to the port configured (8081 for the purposes of explaining my situation). I'm able to post,get,put,delete as expected.
My goal is to have the node application running at mydomain.com/subfolder. When nginx is configured with the location of '/', everything works as expected. Config below:
upstream app_yourdomain {
server 127.0.0.1:8081;
}
server {
listen 0.0.0.0:80;
server_name yourdomain.com yourdomain;
access_log /var/log/nginx/yourdomain.log;
location / {
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;
proxy_pass http://app_yourdomain/;
proxy_redirect off;
}
}
As soon as I change the location to /subfolder, however, my get,post,put,delete requests return 404 responses. The index.html configured in the node application is returned though. Configuration below:
upstream app_yourdomain {
server 127.0.0.1:8081;
}
server {
listen 0.0.0.0:80;
server_name yourdomain.com yourdomain;
access_log /var/log/nginx/yourdomain.log;
location /subfolder {
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;
proxy_pass http://app_yourdomain/;
proxy_redirect off;
}
}
In my angular factory, I have my requests structured like return $http.get('/subfolder'); or return $http.post('/subfolder', {data: data});.
And, within my node application, I have the routes defined like app.get('/subfolder', somefunction); or app.post('/subfolder', somefunction);
Again, when I have the application running from the root of the domain, it works fine. When I have it configured to be in a subfolder of the domain, however, the requests no longer work.
My end goal would be to have multiple node applications running from sub-folders of a main domain. I've been fighting with this for a while, and found several articles for hosting mutliple node apps on a single server, but they seem geared toward having separate domains. I'd like (if possible) for these to run as separate apps for the same domain.
Any thoughts/tricks/pointers? Thanks!
Modify Your Nginx File to look like this:
upstream node{
server 127.0.0.1:3000;
}
listen 0.0.0.0:80;
server_name yourdomain.com yourdomain;
access_log /var/log/nginx/yourdomain.log;
location /node {
rewrite /node(.*) $1 break;
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;
proxy_pass http://node;
proxy_redirect http://node/ /node;
}
I got the above from here: http://skovalyov.blogspot.com/2012/07/deploy-multiple-node-applications-on.html and it works for me

Resources