Nginx与角度6路由冲突

Question

我有一个angular 6应用，其基本href设置为/dashboard/。 使用--prod标志生成的服务器上的已构建文件a。

nginx conf看起来像：

location /dashboard {
    alias /<path_to_built_files>/frontend/dist/frontend/;
}

当我第一次访问网站时说example.com/dashboard， 应用程序会完美加载，并且将角度重定向重定向到默认路由/create。 因此，浏览器将我的路线显示为example.com/dashboard/create。

这正是我希望它表现的方式。 但是，如果我从此处重新加载页面，浏览器将尝试找到example.com/dashboard/create，并返回404 Not Found。

这里的配置我在做什么错？

Answer 1

如果在index.html的路径上找不到文件，则需要设置索引文件和重定向：

location /dashboard {
  alias /<path_to_built_files>/frontend/dist/frontend/;
  index index.html;
  try_files $uri $uri/ index.html =404;
}

Answer 2

  

您可以使用 哈希 location strategy ，这有助于记住浏览器的URL。 它使用URL的哈希片段部分来存储客户端的状态，更易于设置，并且不需要服务器端的任何合作。因此，只需在路由器配置中添加useHash，如下所示-

RouterModule.forRoot(appRoutes, {useHash: true});

然后，您可以重建应用程序并部署到生产环境。您会看到#已添加到您的URL。