如何配置 Nginx 以使用 html5 模式

对于 angularjs 中的干净网址，我必须使用$locationProvider.html5Mode(true);但是当我刷新页面时，它显示 404。

我读到我需要配置服务器文件。

结构

 /html -
 /views -
   home.html
   about.html
   contact.html
 index.html
 app.js

到目前为止我所做的：

nginx.conf

server {
    root /html/views;
    index index.html;

    location / {
    try_files $uri $uri/ =404;
    }
}

Angular HTML5 定位模式基本上利用 HTML5 历史记录 API 来“模拟”客户端中的 URL 变化。但从服务器的角度来看，URL 可能不是真实的（不存在），因此不可能在服务器上找到这些页面。通常有两种解决方案可以让服务器知道URL：

1. 使用服务器端渲染。这被另一个名为 ReactJS 的框架广泛使用。实际上 AngularJS 2.0 也可以在服务器上运行。因此，可以在服务器端生成真实页面并将其提供给客户端。
2. 使用 HTTP 服务器重写技术。这就是你正在尝试做的事情。这个想法是将所有相关请求转发到单个 AngularJS 入口点 HTML 页面，通常是index.html从根源上。

对于您的情况，假设 AngularJS 的入口点是/index.html。尝试这个：

server {
    root /html/views;
    index index.html;

    location / {
        try_files $uri $uri/ /index.html =404;
    }
}

之前的解决方案并不完美，因为它会任意测试每个请求。我们可以通过指定更详细的规则来避免不必要的 URL 查找：

server {
    root /html/views;
    index index.html;

    rewrite "^/users" /index.html last;
    rewrite "^/pages" /index.html last;
    ...
}

使用正则表达式来匹配您想要通过 Angular 提供服务的 URL。