如何在不同路由的同一域上运行两个Angular / Node.js应用程序?

时间:2019-05-01 12:09:22

标签: node.js angular nginx angular-routing nginx-location

我有两个Angular应用程序,一个用于用户,另一个用于管理员,分别在70007001的不同帖子上运行。第一个应用程序应在example.com/demo上运行,第二个应用程序应在example.com/demo/admin上运行。

应用程序的目录结构如下:

/root
     /main-app (angular app for users)
     /main-app-server  (node.js app that serves the user app on port 7000)
     /admin-app (angular app for admins)
     /admin-app-server  (node.js app that serves the admin app on port 7001)

我在/etc/nginx/sites-available/example.com创建了一个新文件,其中包含我的服务器和位置块。

# example.com Server Block
server {
        # SSL Configuration
        listen [::]:443 http2;
        listen 443 http2;
        ssl_certificate /etc/letsencrypt/live/example.com/fullchain.pem; # managed by Certbot
        ssl_certificate_key /etc/letsencrypt/live/example.com/privkey.pem; # managed by Certbot
        include /etc/letsencrypt/options-ssl-nginx.conf; # managed by Certbot
        ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem; # managed by Certbot

        # Root Directory
        root /var/www/example.com/root;

        # Add index.php to the list if you are using PHP
        index index.html index.htm;

        # Server Name
        server_name example.com;

        # Security
        server_tokens off;

        # Location Blocks
        # Example Application
        location /demo {
                proxy_pass http://localhost:7000;
                proxy_http_version 1.1;
                proxy_set_header Upgrade $http_upgrade;
                proxy_set_header Connection 'upgrade';
                proxy_set_header Host $host;
                proxy_cache_bypass $http_upgrade;
        }

        # Example Admin Application
        location /demo/admin {
                proxy_pass http://localhost:7001;
                proxy_http_version 1.1;
                proxy_set_header Upgrade $http_upgrade;
                proxy_set_header Connection 'upgrade';
                proxy_set_header Host $host;
                proxy_cache_bypass $http_upgrade;
        }
}

server {
        listen 80;
        listen [::]:80;
        if ($host = example.com) {
                return 301 https://$host$request_uri;
        }
        server_tokens off;
        server_name example.com;
        return 301 https://example.com$request_uri;
        location / {
                try_files $uri/ =404;
        }
}

...,但是Angular应用程序均无法正常运行,因为Angular会在两个应用程序的/root/文件夹中寻找静态资源。 (例如:example.com/style123.css)

用户应用程序控制台: enter image description here

管理应用程序控制台 enter image description here

我是否配置了服务器和/或位置块? 有人可以指出我正确的方向吗?

0 个答案:

没有答案