Question

我正在尝试在Nginx中为Angular部署的站点（我有一个带有index.html文件的dist目录）提供服务。在那个目录中我有：

的index.html
js files
css文件
资产

我没有Nginx的经验，所以我试图正确地服务这个网站。我对该网站的配置是：

server {
    listen  80;
    server_name sibdomain.domain.com;

    location ~* \.(?:css|js|map|jpe?g|gif|png)$ { }

    location / {
        root  /var/www/multiapp/dist;
        index  index.html index.htm;
        try_files $uri $uri/ =404;
         if (!-e $request_filename){
             rewrite ^(.*)$ /index.html?path=$1 break;
         }
    }

    error_page  500 502 503 504  /50x.html;
    location = /50x.html {
        root  /var/www/multiapp/dist;
    }
}

现在唯一正在索引中加载的文件，但是css和js文件返回404.在apache中，这个网站工作正常，我有这个规则：

RewriteEngine on
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d

# not rewrite css, js and images
RewriteCond %{REQUEST_URI} !\.(?:css|js|map|jpe?g|gif|png)$ [NC]
RewriteRule ^(.*)$ index.html?path=$1 [NC,L,QSA]

我使用了this site，他们为我提供了这个翻译：

# nginx configuration 
  location ~* \.(?:css|js|map|jpe?g|gif|png)$ { }
  location / { 
      if (!-e $request_filename){ 
        rewrite ^(.*)$ /index.html?path=$1 break; 
      }
  }

我检查了nginx的日志，我注意到它正试图从另一条路径加载这些文件，错误就是这个：

2017/12/13 22:47:55 [error] 14096#0: *50 open() "/usr/share/nginx/html/polyfills.22eec140b7d323c7e5ab.bundle.js" failed (2: No such file or di$rectory), client: xx.xxx.xxx.xx, server: subdomain.domain.com, request: "GET /styles.15b17d579c8773c5fdbd.bundle.css HTTP/1.1"

那么，为什么它尝试从/ usr / share / nginx / html /加载而不是我配置的根路径？我应该修改什么才能加载css和js文件？感谢

Answer 1

您遗失了root个location个版块的root，但由于它们共享相同的server，因此无论如何都应将其移至try_files版本。

您不需要if...rewrite和try_files。仅使用location就可以实现相同的功能。

最后一个root阻止是不必要的，因为它使用与location /相同的server { listen 80; server_name sibdomain.domain.com; root /var/www/multiapp/dist; location ~* \.(?:css|js|map|jpe?g|gif|png)$ { } location / { index index.html index.htm; try_files $uri $uri/ /index.html?path=$uri&$args; } error_page 500 502 503 504 /50x.html; }。

pip install whitenoise

有关详情，请参阅this document。

使用Nginx加载CSS和Js文件

1 个答案: