Serve .min.css files first nginx - css

I need to configure nginx server.
I have folder with css files there are files some_file.min.css but in html website ask for some_file.css. I need to redirect this request to *min.css and if minified file doesnt exist return normal .css file
location ~* \.(css)$ {
root /usr/share/nginx/html;
try_files $1.min.$2 $uri =404;
expires 30d;
}
This piece of code does not work.

You need to split the URI into two parts and insert the .min. sequence in between. Your try_files statement is probably ok, but you have not captured the correct $1 and $2 variables.
You need to capture that part of the URI before the .css. For example:
location ~* ^(.*)\.css$ {
root /usr/share/nginx/html;
try_files $1.min.css $uri =404;
expires 30d;
}

Try this:
location ~* ^(.*)(?<!\.min)\.(js|css|html)$ {
try_files $1.min.$2 $uri =404;
}

Related

Location not working for files but only for path

I have a nginx.conf that looks like this:
server {
...
root /var/opt/data/web;
...
location ~* \.(?:eot|woff|woff2|ttf|js)$ {
expires 1M;
}
...
location /one {
root /var/opt/data/alternatives;
try_files $uri $uri/ =404;
}
location /two {
root /var/opt/data/alternatives;
try_files $uri $uri/ =404;
}
}
when I curl http://localhost/one/ I get the content of index.html stored in /other. But when I curl .../localhost/one/foo.js the file is not found and I get this in the error.log:
open() "/default/foo.js" failed (2: No such file or directory)
I tried other variants like location ~ (one|two), location /one/ or even location ~ /(one|two) but all of them didn't work.
The complete config consists of a lot more locations, but I guess the cause of my problem is the location where I set up .js resources to expire -1 because this prevents changing the root to what I need.
If this matters: I use nginx 1.15.2. In case you are wondering why I have this strange alternatives directory: the web directory is created by a CMS software while alternatives is git pulled.
nginx chooses a one location to process a request. Your location ~* \.(?:eot|woff|woff2|ttf|js)$ block processes any URI that ends with .js, and its root value is inherited from the outer block as /var/opt/data/web.
Where you have multiple roots, you need to ensure that those location blocks take precedence, by using the ^~ modifier. See this document for details.
For example:
server {
...
root /var/opt/data/web;
...
location ~* \.(?:eot|woff|woff2|ttf|js)$ {
expires 1M;
}
...
location ^~ /one {
root /var/opt/data/alternatives;
try_files $uri $uri/ =404;
location ~* \.(?:eot|woff|woff2|ttf|js)$ {
expires 1M;
}
}
...
}
If you need your expires rule to apply to the other roots, you will need to repeat the location within that scope, as shown above.
As an alternative, the expires directive can be used in conjunction with a map. See this document for details.
For example:
map $request_uri $expires {
default off;
~*\.(eot|woff|woff2|ttf|js)(\?|$) 1M;
}
server {
...
root /var/opt/data/web;
expires $expires;
...
location ^~ /one {
root /var/opt/data/alternatives;
try_files $uri $uri/ =404;
}
...
}

Use nginx directive to look for a jpg in another location

I have a general nginx rule to serve jpgs from their URI.
So if the URI is "http://example.com/images/1.jpg" it will serve under the form root of the site/images/1.jpg
I want to try and serve the image from alternative path if not found on the original path. How do I write the second location?
Here is what I got:
location ~* ^.+\.(jpg|jpeg|gif|png|svg|js|css|mp3|ogg|mpe?g|avi|zip|gz|bz2?|rar|swf|ico)$ {
try_files $uri $uri/ #fallback;
access_log off;
expires max;
log_not_found off;
}
How do I write the fallback to look for the files in another location like /home/user/anotherfolder?
You can use a named capture in the regular expression location to save the filename for later. You can cascade named locations, to try different roots:
location ~* ^/images(?<filename>/.+\.jpg)$ {
try_files $uri #other;
}
location #other {
root /path/to/alternate;
try_files $filename #fallback;
}
If there is a suitable common parent directory, you can achieve the same thing in a single location block.
location ~* ^/images(?<filename>/.+\.jpg)$ {
root /path/to/ancestor;
try_files /dir/$uri /other/dir/$filename #fallback;
}

Defaulting to 404 when file doesn't exist in nginx

Here is my nginx setup:
location / {
root /var/www/web-app/public;
index index.html index.htm;
try_files $uri $uri/ /index.html;
default_type "text/html";
}
location /profile_images {
try_files $uri $uri/ =404;
}
The question is on that second block. It is a directory full of images. When I look up an image based on a user id, I may or may not have the image. If not, I want a 404 error. Based on the above I am getting a 404 on all images now. I have tried both 404 and =404.
The first location is my api which works fine.
I look up the images (in html) with src='/profiles_images/***.png'
For what it is worth, I am using reactjs.
You are missing a root directive for the second location block. Where several location blocks share the same value for root, it is usual practice to place the root statement in the enclosing server block so that all location blocks inherit the same value. For example:
server {
...
index index.html index.htm;
root /var/www/web-app/public;
location / {
try_files $uri $uri/ /index.html;
}
location /profile_images {
try_files $uri $uri/ =404;
}
}
See this document for more.

Nginx configuration for single page app and nested directories

I have a directory/files structure such as:
root/
a/
utils.js
b/
assets/
styles.css
app.js
index.html
And I want to configure nginx to serve files from a directory directly if exist and have single page app in directory b (if file in path exists the it wil be served directly, nd if not the fallback will end up at index.htm file.
For example:
myapp.com/a/utils.js will return that file.
myapp.com/b/ or myapp.com/b/foo will display index.html
myapp.com/b/assets/style.css will return directly css file
I tries multiple different configurations and non had worke so far. For exampe the simplest:
server {
listen 80;
root /root;
index index.html;
location / {
try_files $uri $uri/ /index.html =404;
}
}
I also tries something to serve different directories:
server {
listen 80;
root /root;
index index.html;
location /a {
try_files $uri $uri/ =404;
}
location /b {
try_files $uri $uri/ /index.html =404;
}
}
I tried to define different roots as well:
server {
listen 80;
index index.html;
location /a {
root /root/a;
try_files $uri $uri/ =404;
}
location /b {
root /root/b;
try_files $uri $uri/ /index.html =404;
}
}
Nginx seems to ignore existing files and ends up returning 404 page at all times. When I try to access soe existing file directly it gets redirected to / (root) url regardless.
The last parameter of a try_files statement is the default action. There can only be one. Many of your examples have two. See this document for details.
The correct URI for your index.html file is /b/index.html which is what you need to use for the default action of the try_files statement.
This should meet your requirements:
location / {
try_files $uri $uri/ /b/index.html;
}
You do not state what should happen with the URI /a/foo. In the above case, it would also return index.html. If you need it to return a 404 response, you would use:
location / {
try_files $uri $uri/ =404;
}
location /b {
try_files $uri $uri/ /b/index.html;
}
See this document for more.

Multiple Location For Static Location in Nginx Configuration

I have a two locations where my app will serve static files, one is /my/path/project/static and the other is /my/path/project/jsutils/static.
I'm having a hard time getting the webserver to look in both directories for static content. Here is my entry for static location in the nginx configuration file for my app.
location ^~ /static {
root /my/path/project/static;
alias /my/path/project/jsutils/static;
index index.html index.htm;
}
I get an error that says : "alias" directive is duplicate, "root" directive was specified earlier.
I'm not sure how to go about having nginx look in both these paths for static content.
Thank you in advance for any help.
location ^~ /static {
root /my/path/project/static;
index index.html index.htm;
try_files $uri $uri/ #secondStatic;
}
location #secondStatic {
root /my/path/project/jsutils/static;
}
So first the file will be searched in /my/path/project/static and if that could not be found there, the secondStatic location will be triggered where the root is changed to /my/path/project/jsutils/static.
You may use try_files (http://wiki.nginx.org/HttpCoreModule#try_files). Assuming that you static files are in /my/path/project/static and /my/path/project/jsutils/static. you can try this:
location ^~ /static {
root /my/path/project;
index index.html index.htm;
try_files $uri $uri/ /jsutils$uri /jsutils$uri/ =404;
}
Let me know if it works. Thanks!
Just implement your configuration in nginx language:
location /my/path/project/static {
try_files $uri =404;
}
location /my/path/project/jsutils/static {
try_files $uri =404;
}
I had the exact same problem and it looks like nginx doesn't like when root is overwritten by an alias. I fixed it by firstly removing the root declaration that was inside the server section and instead declared the root and alias appropriately directly in the location sections (note the commented out lines):
server {
# root /usr/share/nginx/html;
location /logs/ {
root /home/user/develop/app_test;
autoindex on;
}
location /logs2/ {
# root /home/user/branches/app_test;
alias /home/user/branches/app_test/logs/;
autoindex on;
}
}

Resources