如何为静态 Angular UI 配置 nginx

要使 Angular UI 与 nginx 一起工作，你必须为任何否则会返回 404 的 URL 加载 index.html，以允许路由工作：

nginx_angular_try_files.conf

location / {
  try_files $uri $uri$args $uri$args/ /index.html;
}

location / {
  try_files $uri $uri$args $uri$args/ /index.html;
}

带有 API 的默认站点的完整示例：

nginx_angular_full.conf

server {
  listen 80 default_server;
  listen [::]:80 default_server;

  root /var/www/html;

  index index.html;

  server_name MyServer;

  location / {
    try_files $uri $uri$args $uri$args/ /index.html;
  }

  location /api {
    proxy_pass http://localhost:8080;
  }
}

server {
  listen 80 default_server;
  listen [::]:80 default_server;

  root /var/www/html;

  index index.html;

  server_name MyServer;

  location / {
    try_files $uri $uri$args $uri$args/ /index.html;
  }

  location /api {
    proxy_pass http://localhost:8080;
  }
}

Check out similar posts by category: Nginx

If this post helped you, please consider buying me a coffee or donating via PayPal to support research & publishing of new posts on TechOverflow

Buy me a coffee