【发布时间】：2017-07-18 01:42:21
【问题描述】：
我有一个 Angular2/Angular 应用程序在 docker 容器中运行，并使用 nginx 为其提供服务。所以我的应用程序库 = /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/(?<section>.*) {
proxy_pass http://$hostname/api/$section;
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;
}
}
}
我的应用还有其他几条路线，例如/myapp/page1 或 /myapp/page2。当使用 nodejs 在开发模式下为应用程序提供服务时，这些路由可能会被命中。但是，一旦我将它容器化（容器化不是问题）并使用 nginx 提供服务，那么在尝试访问 /myapp/page1 或 /myapp/page2 时会出现 404 未找到。错误日志输出
2017/02/27 12:15:01 [error] 5#5: *3 open() "/usr/share/nginx/html/myapp/page1" failed (2: No such file or directory), client: 172.17.0.1, server: , request: "GET /myapp/page1 HTTP/1.1", host: "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
}
];
【问题讨论】：
-
位置 /myapp 不应该是位置 /myapp/ 吗？
-
无论哪种方式都可以。我的问题是我无法让 /myapp/page1 映射到我的 Angular2 路由“page1”。这总是返回 404
-
嗯.. 它应该将所有内容重定向到 index.html，然后您的路由器可以接收它。它没有正确重定向到 /myapp/index.html 的事实表明位置或 try_files 不正确。您是否尝试添加结束 / ？
-
是的，两者都试过了。两种方法都奏效了。用角度路线更新了问题。 @MikeOne
-
不确定这是否是一个问题，但 html base href =
。如果我在浏览器中输入localhost/myapp，则始终添加尾随/
标签： angular nginx docker nginx-location