Angular black page behind nginx and kubernetes

When you enable rewrite-target it will create a capture group and send it to the appropriate service.

If you set the capture group to $1, everything after the root / will be discarted and the request is forwarded to root path.

• In order to forward the full request, remove the rewrite-target line, your Ingress should be like this:

apiVersion: networking.k8s.io/v1beta1 kind: Ingress metadata:   name: ingress   annotations:     kubernetes.io/ingress.class: nginx spec:   rules:   - host: app.info     http:       paths:       - path: /         backend:           serviceName: searchappfront           servicePort: 80       - path: /api         backend:           serviceName: subscriberservice           servicePort: 8090    

Example:

• I've deployed two echo-apps that echoes the requests, I've suppressed the output to show the path and the pod handling it on the background).

  • echo1-app is simulating searchappfront
  • echo2-app is simulating subscriberservice

• This is the ingress I'm using:

apiVersion: networking.k8s.io/v1beta1kind: Ingressmetadata:  name: echo-ingress  annotations:    kubernetes.io/ingress.class: nginxspec:  rules:    - host: app.info      http:        paths:          - path: /            backend:              serviceName: echo1-svc              servicePort: 80          - path: /api            backend:              serviceName: echo2-svc              servicePort: 80

• Now let's test the commands:

$ kubectl get ingressNAME           HOSTS      ADDRESS        PORTS   AGEecho-ingress   app.info   35.188.7.149   80      73m$ kubectl get podsNAME                            READY   STATUS    RESTARTS   AGEecho1-deploy-764d5df7cf-2wx4m   1/1     Running   0          74mecho2-deploy-7bcb8f8d5f-xlknt   1/1     Running   0          74m$ tail -n 1 /etc/hosts35.188.7.149 app.info$ curl app.info{"path": "/",  "os": {"hostname": "echo1-deploy-764d5df7cf-2wx4m"}}$ curl app.info/foo/bar{"path": "/foo/bar",  "os": {"hostname": "echo1-deploy-764d5df7cf-2wx4m"}}$ curl app.info/api{"path": "/api",  "os": {"hostname": "echo2-deploy-7bcb8f8d5f-xlknt"}}$ curl app.info/api/foo{"path": "/api/foo",  "os": {"hostname": "echo2-deploy-7bcb8f8d5f-xlknt"}}$ curl app.info/api/foo/bar{"path": "/api/foo/bar",  "os": {"hostname": "echo2-deploy-7bcb8f8d5f-xlknt"}}

To summarize:

• Requests to app.info/ will be delivered to echo1-app as /
• Requests to app.info/foo/bar will be delivered to echo1-app as /foo/bar
• Requests to app.info/api will be delivered to echo2-app as /api
• Requests to app.info/api/foo/bar will be delivered to echo2-app as /api/foo/bar

Considerations about your environment:

• I understand you are using NodePort to test the access, but if you wish to close that access, you can set the services as ClusterIP since it will be Ingress job to handle the incoming traffic.

• Nodeport port range by default is 30000-32767.

  • searchappfront has it set to 80, which will be ignored and the correct port will be attributed.

If you have any question let me know in the comments.