使用Nginx的Express JS应用-提供子文件夹时与静态文件发生冲突 [英] Express js app with nginx - a conflict with static files when serving a subfolder

问题描述

upstream app {
    server localhost:3000;
}

server {
    ...
    # If I comment this location out, images are displayed on the website
    location ~* \.(?:jpg|jpeg|png|gif|swf|xml|txt|css|js)$ {

        expires 6004800;
        add_header Pragma public;
        add_header Cache-Control "public, must-revalidate, proxy-revalidate";
    }
    ...
    location /app {
        alias /path/to/app/public/; 
        try_files $uri $uri @app;
    }

    location @app {
        rewrite /app(.*) $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 $proxy_host;
        proxy_set_header X-NginX-Proxy true;

        proxy_pass http://app;
        proxy_redirect http://app/ /app/;
    }
    ...
}

我为此苦了一段时间.我在nginx下的子文件夹中有一个快速应用程序.上面是/sites-available/中我的nginx文件中的代码.当我删除静态文件的位置时，会代理该应用程序的图像和CSS，但是如果静态文件缓存位于nginx文件中，则快速应用程序的图像和CSS文件不会显示在网站上.

I'm struggling with this for some time. I have an express app in a sub folder under nginx. Above is the code in my nginx file in /sites-available/. When I remove the location for the static files, the images and css of the app are proxied, but if the static files cache is in the nginx file then the images and css files of the express app are not displayed on the website.

有人可以帮忙吗?

推荐答案

在nginx请求处理中，正则表达式位置优先于前缀位置块.以下是Nginx的位置指令文档的相关摘录.

Regex locations have precedence over prefixed location blocks in nginx request processing. Hereinafter are relevant excerpts of nginx's location directive documentation.

我强烈建议您仔细阅读它们，因为许多人不这样做，并且错过了基础知识.

I strongly encourage you to read them carefully as many people don't do it and miss the basics.

了解关键字之前的一些示例:

A few examples before to understand keywords :

• 前缀位置:location /toto { [...] }
• 正则表达式位置:location ~ /toto { [...] }

• prefixed location : location /toto { [...] }
• regular expression location : location ~ /toto { [...] }

[...]

[ ... ]

要查找与给定请求匹配的位置，nginx首先检查使用前缀字符串定义的位置(前缀位置).其中，将选择并记住具有最长匹配前缀的位置.然后按照在配置文件中出现的顺序检查正则表达式.正则表达式的搜索在第一个匹配项上终止，并使用相应的配置.如果未找到与正则表达式匹配的内容，则使用前面记住的前缀位置的配置.

To find location matching a given request, nginx first checks locations defined using the prefix strings (prefix locations). Among them, the location with the longest matching prefix is selected and remembered. Then regular expressions are checked, in the order of their appearance in the configuration file. The search of regular expressions terminates on the first match, and the corresponding configuration is used. If no match with a regular expression is found then the configuration of the prefix location remembered earlier is used.

[...]

如果最长匹配前缀位置具有"^〜"修饰符，则不检查正则表达式.

If the longest matching prefix location has the "^~" modifier then regular expressions are not checked.

[...]

此外，使用"="修饰符可以定义URI和位置的精确匹配.如果找到完全匹配的内容，搜索将终止. [...]

Also, using the "=" modifier it is possible to define an exact match of URI and location. If an exact match is found, the search terminates. [...]

另一些​​示例说明了两个修改位置查找顺序的运算符:

A few other examples to illustrate the two operators that modifies location lookup order :

• location ^~ /toto { [...] }:具有比正则表达式位置更高优先级的前缀位置
• location = /toto { [...] }:精确前缀的位置(完全匹配，最高优先级)

• location ^~ /toto { [...] } : prefixed location with higher priority than regex locations
• location = /toto { [...] } : exact prefixed location (exact match, highest priority)

总而言之，传入请求URI的位置选择期间的优先级列表为:

To sum things up, the priority list during location election for incoming request URI is :

1. location = /too
2. location ^~ /toto
3. location ~ /toto
4. location /toto

1. location = /too
2. location ^~ /toto
3. location ~ /toto
4. location /toto

因此，解决问题的更干净的方法是使用:

So the cleaner way to solve your issue is using :

location ^~ /app {
    alias /path/to/app/public/; 
    try_files $uri $uri @app;
}

这篇关于使用Nginx的Express JS应用-提供子文件夹时与静态文件发生冲突的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！