Next.js部署自建K8s集群后Nginx Ingress直接路由404问题求助

问题根源在于：Next.js执行next build && next export生成静态文件时，每个路由会对应生成.html后缀的文件（比如/about对应about.html）。页面内跳转是Next.js客户端路由处理，能自动映射到对应文件；但直接访问example.com/about时，Nginx会尝试查找名为about的文件或目录，找不到就返回404，必须手动加.html才能匹配到真实文件。

下面提供两种可行的解决方法：

方案1：修改Nginx Ingress注解添加重写规则 #

直接在Ingress配置中添加Nginx自定义规则，自动将无.html的路由请求重写为对应.html文件。修改后的ingress.yml如下：

apiVersion: networking.k8s.io/v1
kind: Ingress
metadata:
  name: example-ingress
  annotations:
    kubernetes.io/ingress.class: nginx
    # 新增Nginx配置片段，处理路由重写
    nginx.ingress.kubernetes.io/configuration-snippet: |
      # 对不存在的文件/目录请求，重写为对应.html文件
      if (!-e $request_filename) {
        rewrite ^/([^.]+)$ /$1.html last;
      }
      # 根路径直接指向index.html
      rewrite ^/$ /index.html last;
  labels:
    tenant: example
spec:
  rules:
    - host: example.com
      http:
        paths:
          - path: /
            pathType: Prefix
            backend:
              service:
                name: nginx
                port:
                  number: 80

说明：

• 移除了原配置中的rewrite-target和复杂的path规则，改用更精准的configuration-snippet处理路由
• 规则会判断请求路径是否对应真实存在的文件/目录，不存在则自动追加.html后缀
• 根路径直接映射到index.html

方案2：修改容器内的Nginx配置（若后端用Nginx托管静态文件） #

如果你的应用容器本身用Nginx来提供静态文件服务，可以直接在容器的Nginx配置中添加路由规则，Ingress只需做基础转发即可。

示例容器内的Nginx站点配置：

server {
  listen 80;
  root /usr/share/nginx/html;
  index index.html;

  location / {
    # 依次尝试：原路径、加.html的路径、目录、最后回退到index.html
    try_files $uri $uri.html $uri/ /index.html;
  }
}

这个try_files指令会自动处理路由映射：

• 优先匹配静态资源（如/static/js/main.js）
• 对路由路径自动追加.html（如/about → /about.html）
• 最后兜底到index.html，处理404或客户端路由的 fallback

验证方法 #

修改配置后，重新部署Ingress或应用容器，直接访问example.com/about即可正常加载对应页面，无需手动添加.html后缀。

内容的提问来源于stack exchange，提问作者Deac Karns