Vuejs进入kubernetes集群和nginx入口刷新时返回404

Question

我正在尝试将 Vue.js 前端服务运行到启用了 nginx-ingress 的 kubernetes 集群中。该应用程序有 4 个路由，/、/foo/、/bar 和 /about。如果我在除 / 之外的任何路由中访问应用程序并刷新页面，我会从 nginx 入口收到 404 错误。

我正在使用 kubernetes 版本 v1.18.2（客户端和服务器）。集群是由那种（docker程序中的kubernetes）创建的，我按照他们在https://kind.sigs.k8s.io/docs/user/ingress/#ingress-nginx的文档设置了入口。我正在使用的示例应用程序是这个：https://github.com/ovitor/foo

这里是使用的部署、服务和入口。

apiVersion: apps/v1
kind: Deployment
metadata:
  labels:
    app: foo
  name: foo
spec:
  replicas: 1
  selector:
    matchLabels:
      app: foo
  template:
    metadata:
      labels:
        app: foo
    spec:
      containers:
      - image: vcml10/foo:latest
        name: foo
        ports:
          - containerPort: 80
---
apiVersion: v1
kind: Service
metadata:
  labels:
    app: foo
  name: foo
spec:
  ports:
  - name: http
    port: 80
    protocol: TCP
  selector:
    app: foo
---
apiVersion: extensions/v1beta1
kind: Ingress
metadata:
  name: foo-ingress
spec:
  rules:
    - http:
        paths:
          - path: /
            backend:
              serviceName: foo
              servicePort: 80

我做错了什么？

Answer 1

我认为那是因为您只有 / 的路径。

apiVersion: extensions/v1beta1
kind: Ingress
metadata:
  name: foo-ingress
spec:
  rules:
    - http:
        paths:
          - path: /
            backend:
              serviceName: foo
              servicePort: 80

---

如果你想让它适用于/ /foo/ /bar and /about，你必须添加额外的路径。

apiVersion: extensions/v1beta1
    kind: Ingress
    metadata:
      name: foo-ingress
    spec:
      rules:
        - http:
            paths:
              - path: /
                backend:
                  serviceName: foo
                  servicePort: 80
              - path: /foo
                backend:
                  serviceName: foo
                  servicePort: 80
              - path: /bar
                backend:
                  serviceName: foo
                  servicePort: 80
              - path: /about
                backend:
                  serviceName: foo
                  servicePort: 80

---

或

---

使用 nginx 入口文档中提到的 regex

apiVersion: networking.k8s.io/v1beta1
kind: Ingress
metadata:
  name: test-ingress
  annotations:
    nginx.ingress.kubernetes.io/use-regex: "true"
spec:
  rules:
  - host: test.com
    http:
      paths:
      - path: /foo/.*
        backend:
          serviceName: test
          servicePort: 80

---

另外你可以看看rewrite annotation。

---

希望这会有所帮助。