使用Nginx从同一服务器为多个Angular应用提供服务

Question

我在Nginx中为来自同一服务器的多个angular应用提供服务。因此，为了让用户直接浏览到我声明的某些自定义Angular路由，而不必通过主页（避免404页面），我将这些路由从nginx转发到每个Angular应用程序的索引。html，我在每个位置添加了一个try\u文件：

server {
    listen 80;
    server_name website.com;

    # project1
    location / {
        alias /home/hakim/project1/dist/;
        try_files $uri /index.html;
    }

    # project2
    location /project2/ {
        alias /home/hakim/project2/dist/;
        try_files $uri /index.html;
    }

    # project3
    location /project3/ {
        alias /home/hakim/project3/dist/;
        try_files $uri /index.html;
    }
}

此解决方案避免了在走角度路线时出现404错误，但问题是当我浏览到/project2/或/project3/时，它会重定向到/project1/。这显然不是预期的，因为我希望每个位置都转发到/project-I/索引。适当项目的html。




Answer 1

尝试多语言角度应用程序AOT构建的解决方案，这些构建基本上是不同的应用程序-好的，多次使用相同的应用程序，在不同的目录中的不同捆绑包中使用不同的语言构建。

Answer 2

在一个域上有多个独立的应用程序通常是一种糟糕的安全做法。

然而，我相信你在这里面临的是try_files工作方式的特殊性——根据http://nginx.org/r/try_files，

如果没有找到任何文件，则会对最后一个参数中指定的uri进行内部重定向。

实际上，这意味着如果在/索引之后有一个额外的参数。html规范（即，基本上是任何东西），那么您的代码就会按照预期工作；但是，由于缺少任何这样的最终参数，在每种情况下都会将所有内容重定向回/位置，就像获取/索引一样。html HTTP/1.1请求应该已经发出（除了它都是在nginx内部完成的）。

因此，作为一种解决方案，您可以修复内部重定向的路径，使其保持在相同的位置（例如，/projectX/index.html），或者不使用路径，但使最后一个参数返回错误代码（例如，=404，只要文件始终存在，就不应触发该错误代码）。

>

例如，try_files$uri/projectX/index。html ,，

或者，try_files$uri/index。html=404 。

例如：

location /projectX/ {
    alias /home/projectX/dist/;
    try_files $uri /projectX/index.html; # last param is internal redirect
}

或：

location /projectX/ {
    alias /home/projectX/dist/;
    try_files $uri /index.html =404;
}

总之，请注意，/project ectX/index.html只能作为最后一个参数工作，而/index.html只能作为非最终参数工作。

Answer 3

希望这对别人有帮助

步骤1-构建所有项目

ng build --prod --base-href /project1/
ng build --prod --base-href /project2/
ng build --prod --base-href /project3/

步骤2-配置你的nginx，注意在try_files部分添加的更改

server {
    listen 80;
    server_name website.com;

    # project1
    location / {
        alias /home/hakim/project1/dist/;
        try_files $uri/ /project1/index.html;
    }

    # project2
    location /project2/ {
        alias /home/hakim/project2/dist/;
        try_files $uri/ /project2/index.html;
    }

    # project3
    location /project3/ {
        alias /home/hakim/project3/dist/;
        try_files $uri/ /project3/index.html;
    }
}

步骤3-重新加载nginx配置

sudo service nginx reload