【问题标题】:Angular 4 - Nginx / Refresh shows bad pageAngular 4 - Nginx / Refresh 显示错误页面
【发布时间】:2017-08-08 20:04:58
【问题描述】:

我在使用 Nginx 的远程服务器上部署了一个 Angular 4 应用程序,可以通过以下地址访问:http://xx.xx.xx.xx/app。该应用程序运行良好,我可以在我的网站中导航,但是当我刷新一个页面时,例如http://xx.xx.xx.xx/app/page1,它会显示 nginx 的 index.html 页面。

Nginx 的页面位于/usr/share/nginx/html,我的应用的页面位于/var/www/app

nginx.conf

    server {
        listen       80 default_server;
        listen       [::]:80 default_server;
        server_name  _;
        root /usr/share/nginx/html;
        include /etc/nginx/default.d/*.conf;                                                */

        location /app {
            root /var/www;
            try_files $uri $uri/ /index.html;
        }
    }

刷新期间似乎没有考虑root /var/www 行。

我听说过有关 try_files 的错误,看来我需要在某处添加重写。感谢您的帮助。

【问题讨论】:

  • 尝试这样的事情: location ~ ^/app/(.*)$ 而不是 /app 。这确保它不仅在 /app 上匹配任何子页面
  • 您是否尝试将其更改为root /var/www/app;try_files $uri $uri/ /app/index.html;
  • @eesdil 感谢您的建议,但它不会改变任何东西。
  • @PierreDuc 您的第二个建议不起作用。但第一个更有趣。刷新现在效果很好,但是当我访问我的网站时,我会直接重定向到我的应用程序,我不希望这样。所以我试着只写root /var/www;,但行为又像以前一样......
  • 您应该更改为location /app/(额外的斜线)。我想你可以无视我的第一条评论

标签: angular nginx


【解决方案1】:

尝试将其添加到您的 AppModule 中:

import { HashLocationStrategy, LocationStrategy } from '@angular/common';

@NgModule({
    // ...
    providers: [{provide: LocationStrategy, useClass: HashLocationStrategy}],
    // ...
})
export class AppModule {}

【讨论】:

  • 嗯...这很奇怪,由于/#/,URL 有点影响,但它似乎对用户不可见。你能解释一下它是如何工作的吗?谢谢
  • 你可以在这里找到更多解释:stackoverflow.com/questions/35284988/…
猜你喜欢
  • 2017-05-06
  • 2016-06-24
  • 2020-07-24
  • 1970-01-01
  • 2021-06-05
  • 2019-11-13
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多