如何在Kubernetes中路由Angular？

Question

我有一个有角度的应用程序,我正试图在Google Cloud中部署到Kubernetes.我的问题是,每当我尝试导航到应用程序中不是根路径的路径时,例如http:// [ip]/demo,请求不会在应用程序中路由,而是在容器中:如果我在工作目录中有一个名为"demo"的目录,它会尝试返回其内容,因此大部分它返回404.

我已经从虚拟机成功提供了应用程序.我的网络配置如下:

service.yaml

apiVersion: v1
kind: Service
metadata:
  creationTimestamp: 2018-07-10T12:00:52Z
  labels:
    app: app
  name: app
  namespace: default
  resourceVersion: "5759129"
  selfLink: /api/v1/namespaces/default/services/app-service
  uid: [redacted]
spec:
  clusterIP: [redacted]
  externalTrafficPolicy: Cluster
  ports:
  - nodePort: 30909
    port: 80
    protocol: TCP
    targetPort: 80
  selector:
    app: app
  sessionAffinity: None
  type: NodePort
status:
  loadBalancer: {}

ingress.yaml

apiVersion: extensions/v1beta1
kind: Ingress
metadata:
  annotations:
    ingress.kubernetes.io/backends: '{"k8s-be-30909--102c03247288a32a":"HEALTHY"}'
    ingress.kubernetes.io/forwarding-rule: k8s-fw-default-app-ingress--102c03df7288a32a
    ingress.kubernetes.io/target-proxy: k8s-tp-default-app-ingress--102c09bf7288a32a
    ingress.kubernetes.io/url-map: k8s-um-default-app-ingress--102c9df4a288a32a
    kubectl.kubernetes.io/last-applied-configuration: |
      {"apiVersion":"extensions/v1beta1","kind":"Ingress","metadata":{"annotations":{},"name":"app-ingress","namespace":"default"},"spec":{"backend":{"serviceName":"app-service","servicePort":80}}}
  creationTimestamp: 2018-07-10T12:10:08Z
  generation: 1
  name: app-ingress
  namespace: default
  resourceVersion: "5762158"
  selfLink: /apis/extensions/v1beta1/namespaces/default/ingresses/app-ingress
  uid: [redacted]
spec:
  backend:
    serviceName: app-service
    servicePort: 80
status:
  loadBalancer:
    ingress:
    - ip: [redacted]

有谁知道如何解决这一问题？

Answer 1

你遇到了这个问题,因为k8s试图在你的入口上调用路径/ demo,并且没有后端处理这个路径.这是因为角度历史路由.

它在dev中工作,因为dev http服务器知道这一点,因为:

rewrites": [ {
  "source": "**",
  "destination": "/index.html"
} ]

(看看这个答案)

因此,您必须实现的是,您的入口的所有URL都会重写为/index.html.来自nginx ingress的重写目标是不一样的,因为如果你的重写目标是'/',它会将/ path/foo/bar转换为/ foo/bar

那么,有哪些选择？您可以深入了解入口配置.看起来你正在使用GKE入口,你可以使用另一个,但仔细看看没有显示任何特定的配置.

但是,我会通过使用带有我所有自定义重写规则的nginx容器并将其反向代理到您的角度应用程序来解决此问题并将其破解.换句话说,如果我在容器中部署prod angular应用程序,我仍然使用nginx.只需查看本指南,即可正确设置角度的nginx.

结果将是一个docker镜像,其中包含一个自定义nginx,其中包含角度和自定义规则.