Nginx Angular2/Angular路线

发布时间：2020-07-22 22:04:16 所属栏目：Nginx 来源：互联网

导读：我有一个在docker容器内运行的Angular2 / Angular应用程序,并使用nginx来提供它.所以我的app base = / myapp /.使用基本网址(即www.server.com/myapp或www.server.com/myapp/)访问应用时,一切正常events { worker_connections 4096; ##

我有一个在docker容器内运行的Angular2 / Angular应用程序,并使用nginx来提供它.所以我的app base = / myapp /.使用基本网址(即www.server.com/myapp或www.server.com/myapp/)访问应用时,一切正常

events {
  worker_connections  4096;  ## Default: 1024
}

http {
  include /etc/nginx/conf/*.conf;

  server {
    listen       80 default_server;

    root   /usr/share/nginx/html;
    index  index.html index.htm;
    include /etc/nginx/mime.types;
    underscores_in_headers on;

    location /myapp {
      # If you want to enable html5Mode(true) in your angularjs app for pretty URL
      # then all request for your angularJS app will be through index.html
      try_files $uri /myapp/index.html;

    }

    #Static File Caching. All static files with the following extension will be cached for 1 day
    location ~* .(jpg|jpeg|png|gif|ico|css|js)${
      expires 1d;
    }

    ## PROXIES ##
    # location matcher for get requests. Any query params will be proxied using this location block
    location = /myapp/api {

      proxy_pass http://$hostname/api$is_args$query_string;
      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;
      proxy_set_header X-Real-IP $remote_addr;
      proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
      proxy_connect_timeout       120;
      proxy_send_timeout          120;
      proxy_read_timeout          120;
      send_timeout                120;
    }

    # location matcher for post requests i.e. updateAsset. Any request with additional path params will be proxied using this location block
    location ~ ^/myapp/api/(?


我的应用还有其他一些路线,例/ myapp / page1或/ myapp / page2.使用nodejs以开发模式提供应用程序时,可以点击这些路径.然而,一旦我将其容器化(容器化不是问题)并使用nginx服务,那么在尝试访问/ myapp / page1或/ myapp / page2时,我找不到404.错误日志输出
2017/02/27 12:15:01 [错误] 5#5：* 3打开()“/usr/share / nginx / html / myapp / page1”失败(2：没有这样的文件或目录),客户端：172.17 .0.1,server :,request：“GET / myapp / page1 HTTP / 1.1”,主机：“localhost”
我已经尝试在nginx conf文件中映射我的所有应用程序URL但似乎没有任何效果.我如何让它工作？
更新1
增加了角度路线
主应用程序路线：

import { Route } from '@angular/router';
import { MyAppComponent } from './index';

export const MyAppRoutes: Route[] = [
  {
    path: '',component: MyAppComponent
  }
];

第1页路线：

import { Route } from '@angular/router';
import { Page1Component } from './index';

export const Page1Routes: Route[] = [
  {
    path:'page1',component: Page1Component
  }
];



这是我的nginx sites-available / myapp

server {
    listen 80;
    listen 80 [::]:80;
    root /my/root/path;
    server_name www.mysite.com mysite.com;

    location /app1/ {
        alias /my/root/path/app1/;
        try_files $uri$args $uri$args/ $uri/ /app1/index.html;
    }

    location /app2/ {
         ...
    }    
}

设置好配置后,您要启用站点,运行：

sudo ln -s /pathtonginx/sites-available/myapp /pathtonginx/sites-enabled/myapp

我的index.html上的basehref


希望这可以帮助！
                        （编辑：莱芜站长网）
【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!