Angular应用部署K8s后无法通过新标签页直接访问全路径URL

Angular是单页应用（SPA），前端路由在浏览器端处理。直接在新标签页访问/dashboard时，请求会发送到K8s Ingress，Ingress转发给后端服务器后，服务器找不到对应物理文件（因为dashboard是前端路由，不是服务器上的实际路径），所以返回404。而首页内点击跳转是浏览器端路由切换，不会触发新的服务器请求，因此正常。

1. 修正K8s Ingress配置 #

针对Nginx Ingress Controller，添加配置片段让所有请求 fallback到index.html：

apiVersion: networking.k8s.io/v1
kind: Ingress
metadata:
  name: angular-ingress
  annotations:
    # 配置Nginx尝试匹配文件，匹配不到则返回index.html
    nginx.ingress.kubernetes.io/configuration-snippet: |
      try_files $uri $uri/ /index.html;
spec:
  rules:
    - host: base-path.com
      http:
        paths:
          - path: /
            pathType: Prefix
            backend:
              service:
                name: your-angular-service-name  # 替换为你的Service名称
                port:
                  number: 80  # 替换为Service暴露的端口

注意：如果使用其他类型的Ingress Controller（比如Traefik），需要对应调整配置，核心思路是让所有子路径请求都转发到index.html。

2. 确保Angular构建时设置正确的base路径 #

构建应用时指定base-href，确保资源路径正确：

ng build --base-href /

如果部署在子路径下（比如/app），则改为--base-href /app/，同时Ingress的path也对应调整为/app/*。

3. 容器内服务器配置优化（可选，若用Nginx托管） #

如果Angular应用打包后用Nginx容器运行，修改Nginx配置文件，确保路由 fallback：

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

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

将此配置作为自定义配置文件替换Nginx默认配置，确保容器启动时加载该配置。

内容的提问来源于stack exchange，提问作者veeresh patil