<p>I'm trying to learn K8. I have a frontend app that is made using angular. I'm serving it behind an NGINX proxy. I also have a backend that has functionalities. There are my files,</p>
<p><strong>nginx.conf</strong></p>
<pre><code>http {
    upstream gateway {
        server sb-gateway:8081;
    }
    include /etc/nginx/mime.types;
    server {
        listen       80;
        sendfile on;
        default_type application/octet-stream;

        location / {
            root   /usr/share/nginx/html;
            try_files $uri $uri/ /index.html;
            index  index.html index.htm;
        }

        location /api/ {
            proxy_set_header X-Forwarded-Host $host;
            proxy_set_header X-Forwarded-Server $host;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;

            proxy_pass http://gateway;
        }

        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   /usr/share/nginx/html;
        }
    }
}
</code></pre>
<p><strong>user.service.ts</strong></p>
<pre><code>...
return this.http.post('/api/login', {data})
...
</code></pre>
<p><strong>ui-service.yaml</strong></p>
<pre><code>apiVersion: v1
kind: Service
metadata:
  labels:
    app: sb-ui
  name: sb-ui
spec:
  type: LoadBalancer
  ports:
  - port: 80
    targetPort: 80
    nodePort: 30000
  selector:
    app: sb-ui
</code></pre>
<p>The backend service is called <code>sb-gateway</code> and I'm trying to route all requests that have <code>/api/</code> in them to the backend (as specified in NGINX). But I get this error when i try to hit a route from the frontend/pressing a button.</p>
<p><code>POST http://192.168.64.2:30000/api/login 404 (NOT FOUND)</code>.</p>
<p>I'm trying to run this on minikube. I have SSH'd in the frontend pod and tried to curl the backend service. It works. I just need to figure out how am I supposed to communicated from the frontend service to the backend service on angular.</p>
<p>Any help would be greatly appreciated!</p>

hrishikeshpaul
<p>Posting this answer as a community wiki to give more of a baseline on how you can allow/route the traffic to/in the Kubernetes cluster.</p>
<p>Feel free to expand it.</p>
<hr />
<p>Having in mind following statement:</p>
<blockquote>
<p>I'm trying to learn K8.</p>
</blockquote>
<p>Instead of using an <code>nginx</code> <code>Pod</code> that is acting as a proxy, you should be using <code>Ingress</code>.</p>
<p>In short <code>Ingress</code> can be described as:</p>
<blockquote>
<p>An API object that manages external access to the services in a cluster, typically HTTP.</p>
<p>Ingress may provide load balancing, SSL termination and name-based virtual hosting.</p>
<p>-- <em><a href="https://kubernetes.io/docs/concepts/services-networking/ingress/" rel="nofollow noreferrer">Kubernetes.io: Docs: Concepts: Services networking: Ingress</a></em></p>
</blockquote>
<p>Through an <code>Ingress</code> object you can tell your <code>Ingress</code> controller (which in this example will be <code>nginx-ingress</code>) to have a specific configuration that will allow you to route the traffic accordingly.</p>
<hr />
<p>Having as an example following situation:</p>
<ul>
<li>You have your application that should receive request on a <code>/api</code> path</li>
<li>You have other applications that should receive all other request (in this example simple <code>nginx</code> <code>Pod</code>)</li>
</ul>
<p>Being specific to:</p>
<blockquote>
<p>I'm trying to run this on minikube.</p>
</blockquote>
<p><code>Minikube</code> has already built-in <code>Ingress</code> addon that can be enabled with a single command (there are some exceptions, please refer to the documentation of specific <code>--driver</code>):</p>
<ul>
<li><code>$ minikube addons enable ingress</code></li>
</ul>
<p>With above command you will spawn <code>nginx-ingress</code>.</p>
<p>Creating a setup to show how it could be configured:</p>
<ul>
<li><code>$ kubectl create deployment hello --image=gcr.io/google-samples/hello-app:2.0</code></li>
<li><code>$ kubectl expose deployment hello --port=8080 --type=ClusterIP</code></li>
<li><code>$ kubectl create deployment nginx --image=nginx</code></li>
<li><code>$ kubectl expose deployment nginx --port=80 --type=ClusterIP</code></li>
</ul>
<p>The <code>Ingress</code> resource should look like:</p>
<pre class="lang-yaml prettyprint-override"><code>apiVersion: networking.k8s.io/v1
kind: Ingress
metadata:
  name: simple-fanout-example
spec:
  ingressClassName: &quot;nginx&quot;
  rules:
  - host:
    http:
      paths:
      - path: /api
        pathType: Prefix
        backend:
          service:
            name: hello 
            port:
              number: 80
      - path: /
        pathType: Prefix
        backend:
          service:
            name: nginx
            port:
              number: 80
</code></pre>
<p>What above example of <code>Ingress</code> will do:</p>
<ul>
<li>Request with <code>/api</code>, <code>/api/</code>, <code>/api/xyz</code>, etc.:
<ul>
<li>route to <code>hello</code> <code>Service</code> with <code>hello</code> <code>Pod</code></li>
</ul>
</li>
<li>Request with <code>/</code>, <code>/xyz</code>, <code>/abc/xyz</code>, etc.:
<ul>
<li>route to <code>nginx</code> <code>Service</code> with <code>nginx</code> <code>Pod</code></li>
</ul>
</li>
</ul>
<blockquote>
<p>A side note!</p>
<p>If you need to add some specific configuration to your <code>Ingress</code> you can check this documentation:</p>
<ul>
<li><em><a href="https://kubernetes.github.io/ingress-nginx/user-guide/nginx-configuration/annotations/" rel="nofollow noreferrer">Kubernetes.github.io: Ingress nginx: User guide: Nginx configuration: Annotations</a></em></li>
</ul>
</blockquote>
<p>You can see from the <code>hello</code> <code>Pod</code> logs:</p>
<pre class="lang-sh prettyprint-override"><code>2021/04/09 15:22:07 Server listening on port 8080
2021/04/09 15:50:14 Serving request: /api
2021/04/09 15:50:17 Serving request: /api
2021/04/09 15:50:19 Serving request: /api/asdasd
</code></pre>
<hr />
<p>Additional resources:</p>
<ul>
<li><em><a href="https://kubernetes.io/docs/concepts/services-networking/ingress/" rel="nofollow noreferrer">Kubernetes.io: Docs: Concepts: Services networking: Ingress</a></em></li>
<li><em><a href="https://minikube.sigs.k8s.io/docs/commands/addons/" rel="nofollow noreferrer">Minikube.sigs.k8s.io: Docs: Commands: Addons</a></em></li>
<li><em><a href="https://stackoverflow.com/questions/66641786/nginx-installation-and-configuration/66691013#66691013">Stackoverflow.com: Questions: Nginx installation and configuration</a></em></li>
</ul>
