如何在Kubernetes部署Angular+双微服务饮品Web应用？

Got it, let's walk through deploying your Angular app + two stateless microservices (Coffee/Tea) + Nginx setup to Kubernetes. I’ve tackled similar architectures before, so here’s a practical, step-by-step breakdown:

Before diving into Kubernetes manifests, you need to containerize every component—this is non-negotiable, since Kubernetes only manages containerized workloads.

Angular + Nginx Image #

Since your static Angular assets were originally hosted on Nginx, we can bundle the compiled app directly into an Nginx image to keep things streamlined:

• First, build your Angular app for production: ng build --prod (or ng build --configuration production for newer Angular versions)
• Create a Dockerfile in your Angular project root:

# Use official lightweight Nginx image as base
FROM nginx:alpine
# Copy compiled Angular assets to Nginx's default static directory
COPY dist/your-angular-app-name /usr/share/nginx/html
# Optional: Replace default Nginx config to support Angular SPA routing
COPY nginx.conf /etc/nginx/conf.d/default.conf

• Build and tag the image: docker build -t your-registry/angular-nginx:v1 .
• Push it to a container registry (Docker Hub, GCR, or a private registry) so Kubernetes can pull it: docker push your-registry/angular-nginx:v1

Coffee & Tea Microservice Images #

Since these are stateless REST services, their Dockerfiles are straightforward (adjust based on your tech stack—Java, Node.js, Python, etc.):
For example, a Node.js-based Coffee service:

FROM node:18-alpine
WORKDIR /app
COPY package*.json ./
RUN npm install --only=production
COPY . .
EXPOSE 3000
CMD ["node", "server.js"]

• Build, tag, and push each microservice similarly:
  • Coffee: docker build -t your-registry/coffee-service:v1 . && docker push ...
  • Tea: docker build -t your-registry/tea-service:v1 . && docker push ...

Now create YAML manifests for each core Kubernetes resource: Deployments (manage pod replicas), Services (expose pods internally), and Ingress (route external traffic to the right services).

Deployments #

Deployments ensure your pods stay running and are replaced if they fail—perfect for stateless workloads.

Angular-Nginx Deployment (angular-nginx-deployment.yaml) #

apiVersion: apps/v1
kind: Deployment
metadata:
  name: angular-nginx
spec:
  replicas: 2 # Adjust based on your scaling needs
  selector:
    matchLabels:
      app: angular-nginx
  template:
    metadata:
      labels:
        app: angular-nginx
    spec:
      containers:
      - name: angular-nginx
        image: your-registry/angular-nginx:v1
        ports:
        - containerPort: 80
        # Optional: Add health checks to confirm the app is responsive
        livenessProbe:
          httpGet:
            path: /
            port: 80
          initialDelaySeconds: 10
          periodSeconds: 10
        readinessProbe:
          httpGet:
            path: /
            port: 80
          initialDelaySeconds: 5
          periodSeconds: 5

Coffee Service Deployment (coffee-service-deployment.yaml) #

apiVersion: apps/v1
kind: Deployment
metadata:
  name: coffee-service
spec:
  replicas: 2
  selector:
    matchLabels:
      app: coffee-service
  template:
    metadata:
      labels:
        app: coffee-service
    spec:
      containers:
      - name: coffee-service
        image: your-registry/coffee-service:v1
        ports:
        - containerPort: 3000 # Match your service's listening port
        livenessProbe:
          httpGet:
            path: /api/health # Add a health check endpoint to your service
            port: 3000
          initialDelaySeconds: 15
          periodSeconds: 10
        readinessProbe:
          httpGet:
            path: /api/health
            port: 3000
          initialDelaySeconds: 5
          periodSeconds: 5

Tea Service Deployment (tea-service-deployment.yaml) #

Nearly identical to the Coffee service—just swap names and image:

apiVersion: apps/v1
kind: Deployment
metadata:
  name: tea-service
spec:
  replicas: 2
  selector:
    matchLabels:
      app: tea-service
  template:
    metadata:
      labels:
        app: tea-service
    spec:
      containers:
      - name: tea-service
        image: your-registry/tea-service:v1
        ports:
        - containerPort: 3000
        livenessProbe:
          httpGet:
            path: /api/health
            port: 3000
          initialDelaySeconds: 15
          periodSeconds: 10
        readinessProbe:
          httpGet:
            path: /api/health
            port: 3000
          initialDelaySeconds: 5
          periodSeconds: 5

Services #

Services expose your pods to the cluster (or externally). For microservices, we use ClusterIP (internal only); for the Angular app, we’ll use ClusterIP paired with Ingress for clean external routing.

Coffee Service (coffee-service-service.yaml) #

apiVersion: v1
kind: Service
metadata:
  name: coffee-service
spec:
  selector:
    app: coffee-service
  ports:
    - protocol: TCP
      port: 80 # Cluster-internal port
      targetPort: 3000 # Port on the pod
  type: ClusterIP

Tea Service (tea-service-service.yaml) #

apiVersion: v1
kind: Service
metadata:
  name: tea-service
spec:
  selector:
    app: tea-service
  ports:
    - protocol: TCP
      port: 80
      targetPort: 3000
  type: ClusterIP

Angular-Nginx Service (angular-nginx-service.yaml) #

apiVersion: v1
kind: Service
metadata:
  name: angular-nginx
spec:
  selector:
    app: angular-nginx
  ports:
    - protocol: TCP
      port: 80
      targetPort: 80
  type: ClusterIP

Ingress (External Routing) #

Ingress acts as a reverse proxy, routing external traffic to the right services. First, install an Ingress controller (like NGINX Ingress Controller) in your cluster.

Ingress Manifest (app-ingress.yaml) #

apiVersion: networking.k8s.io/v1
kind: Ingress
metadata:
  name: app-ingress
  annotations:
    nginx.ingress.kubernetes.io/rewrite-target: /$1
    # Optional: Add SSL cert annotations if using HTTPS
spec:
  rules:
  - host: your-app-domain.com # Replace with your domain (use localhost for testing)
    http:
      paths:
      - path: /(.*)
        pathType: Prefix
        backend:
          service:
            name: angular-nginx
            port:
              number: 80
      - path: /api/coffee/(.*)
        pathType: Prefix
        backend:
          service:
            name: coffee-service
            port:
              number: 80
      - path: /api/tea/(.*)
        pathType: Prefix
        backend:
          service:
            name: tea-service
            port:
              number: 80

Once all manifests are ready, deploy them to your Kubernetes cluster:

1. Apply deployments:

   kubectl apply -f angular-nginx-deployment.yaml
   kubectl apply -f coffee-service-deployment.yaml
   kubectl apply -f tea-service-deployment.yaml
   

2. Apply services:

   kubectl apply -f coffee-service-service.yaml
   kubectl apply -f tea-service-service.yaml
   kubectl apply -f angular-nginx-service.yaml
   

3. Apply Ingress:

   kubectl apply -f app-ingress.yaml
   

Verify everything is running:

• Check pods: kubectl get pods (all should show Running)
• Check services: kubectl get services
• Check Ingress: kubectl get ingress
• Test endpoints:
  • Frontend: Visit http://your-app-domain.com
  • Coffee API: curl http://your-app-domain.com/api/coffee
  • Tea API: curl http://your-app-domain.com/api/tea

Since your microservices are stateless, keep these in mind:

• Never store persistent data locally—use external databases or object storage if needed
• Use environment variables for configuration (add env fields to Deployment manifests to pass things like database URLs)
• Scaling is easy: adjust the replicas count in Deployments, or use Horizontal Pod Autoscaler for automatic scaling based on load

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