如何在 nginx 中从多个 JS、CSS 目录提供 HTML

Question

我的目录结构是-

project
|----theme
|    |----css
|    |----images
|    |----js
|
|----pages
|    |----css
|    |----images
|    |----js
|    |----index.html
|
|----libraries
|    |----lib1
|    |     |----lib1.js
|    |    
|    |----lib2
|    |     |----lib2.js

我的 nginx/sites-available 配置是-

server {
  listen 80 default_server;
  listen [::]:80 default_server;
  root /home/ubuntu/project/pages;
  index index.html;
  server_name mydomain.com www.mydomain.com;

  location ~* \.(js|jpg|png|css)$ {
    root /home/ubuntu/project;   -----(A)
  }
}

我在 pages/index.html 中引用了“主题”和“库”中的文件。 但是控制台在尝试加载这些文件时会输出 404 错误。 如何正确提供这些文件？

如果我在 (A) 中为 root 编辑并附加“/pages”，则会提供“pages” JS，但随后又找不到“theme”和“libraries”中的文件（在控制台中显示 404 错误）。

Answer 1

您需要使用try_files 来尝试不同的位置

location ~* \.(js|jpg|png|css)$ {
  root /home/ubuntu/project;
  try_files $uri $uri/ /pages$uri /theme$uri =404;
}