Question

我的目标是在同一个域下设置两个不同的单页应用（SPA），我们在其中显示与所请求的位置/路径相对应的SPA。我也想默认为两个SPA的/位置之一。并且..如果有人在浏览器中输入网址，我希望SPA附加的html5历史记录位置路径实际路由到正确的位置。

用一个例子来解释更容易。

示例：

用户导航到mydomain.com/app 并且服务器提供/ home / user / app / dist下的内容（其中包含index.html和所有js / css资产）（使用linux so / home / user只是我的主目录路径）。

用户导航到mydomain.com/auth 并且服务器提供/ home / user / auth / dist

下的内容

用户导航到/ 并且服务器提供/ home / user / auth / dist下的内容（默认情况下为/ navs至auth）

用户导航到mydomain.com/auth/login 并且服务器再次提供/ home / user / auth / dist文件夹下的内容但是url保留mydomain.com/auth/login，以便auth SPA可以用作路由

用户导航到mydomain.com/auth/signup 并且服务器再次提供/ home / user / auth / dist文件夹下的内容再次，网址保留mydomain.com/auth/login，以便auth SPA可以用作路由

用户导航到mydomain.com/app/home 并且服务器提供/ home / user / app / dist

下的内容

我尝试过root / alias / rewrite / regex / = / ^〜规则。我试图对nginx设置有更深入的了解，但与此同时，这就是我目前所拥有的：

server {
listen [::]:80 default_server;
listen 80;
server_name mydomain.com 127.0.0.1;    # Make it serve in mydomain.com

# ^~ rules stop matching after the exact match 
location ^~ /app {                     # if location start matches /app
  alias /home/user/app/dist;
  index index.html;
  try_files $uri $uri/ index.html =404;
}                                      # if location start matches app/lobby
location ^~ /app/home {
  alias /home/user/app/dist;
  index index.html;
  try_files $uri $uri/ index.html =404;
}

# you can see that I need to add a new one per each client js app route
location ^~ /app/home/visitor {
  alias /home/user/app/dist;
  index index.html;
  try_files $uri $uri/ index.html =404;
}

location ^~ /auth/login {
  alias /home/user/auth/dist;
  index index.html;
  try_files $uri $uri/ index.html =404;
}
location ^~ /auth {
  alias /home/user/auth/dist;
  index index.html;
  try_files $uri $uri/ index.html =404;
}

# Rewrites / to auth, appending whatever params to path
#   var (for the client to consume)for now
location / {
  rewrite ^/(.*) /auth?path=$1 last;
}

}

}

它应该在/ dist文件夹下找到index.html

我想使用正则表达式或位置匹配，让匹配的其余部分通过客户端js应用程序捕获，这样我就不必为每个路由添加新规则（这个应用程序实际上有嵌套的州路线）。我知道位置^〜修饰符在匹配特定规则后停止，但我无法以任何其他方式使其工作。如果我不使用修饰符，或常规表达位置匹配，或=修饰符...我只是从nginx得到404,403和500个响应。

另外，如果我停止使用别名/重写并使用root关键字，它会尝试在dist文件夹下找到/ app或/ auth实际文件夹，它实际上不应该（如果/ home / user / auth） / dist / auth文件夹已存在）。

我也让客户知道每个SPA的基本目录是什么 basedir =“app”（对于应用程序一）和basedir =“auth”为auth。

我认为我在重写错误，或者我需要更多重写或其他规则来使事情变得更通用。

我该怎么做呢？可以理解某种样本配置。感谢。

P.S。如果有人好奇，我正在使用Ember和Ember-cli。这会生成带有内置应用程序的dist /文件夹，并且还可以允许http://www.mydomain/app/home/visitor/comments/new这样的路由，这就是为什么硬编码每条路径都没有意义（应用程序仍处于开发阶段，需要更多路由！）

修改

我也试过这个，我在/ app和/ auth路径中得到404：

server {
listen [::]:80 default_server;
listen 80;
server_name localhost mydomain.com 127.0.0.1;

index index.html;

location /app {
  root /home/user/app/dist;
  try_files $uri $uri/index.html index.html;
}

location /auth {
  root /home/user/auth/dist;
  try_files $uri $uri/index.html index.html;
}

}

Answer 1

在此之前，请确保default中没有sites-enabled配置，这有时可能会导致意外行为。

修改最终配置

server { listen [::]:80 default_server; listen 80; server_name localhost mydomain 127.0.0.1; location /app { alias /home/user/app/dist/; index index.html; try_files $uri $uri/ index.html =404; } location /auth { alias /home/user/auth/dist/; index index.html; try_files $uri $uri/ index.html =404; } location / { rewrite ^/(.*) /auth?$1 last; } }

还值得查看this question和nginx docs，它们可以解释根和别名之间的差异。

如何设置NGINX以根据位置（在相同server_name下）部署不同的单页应用程序（SPA的...即静态文件）和子路由

修改

1 个答案: