测试你的 Angular 部署

目录

先决条件

在开始之前，请确保您已完成以下操作

Kubernetes 新手？
访问 Kubernetes 基础教程，熟悉集群、Pod、部署和服务的工作原理。

概述

本节将指导你使用 Docker Desktop 内置的 Kubernetes 在本地部署容器化的 Angular 应用程序。在本地 Kubernetes 集群中运行你的应用程序可以高度模拟真实的生产环境，使你能够在将工作负载推广到预发布或生产环境之前，自信地进行测试、验证和调试。

创建 Kubernetes YAML 文件

请按照以下步骤定义部署配置

  1. 在项目根目录下，创建一个名为：`angular-sample-kubernetes.yaml` 的新文件。

  2. 在您的 IDE 或首选文本编辑器中打开该文件。

  3. 添加以下配置，并确保将 `{DOCKER_USERNAME}` 和 `{DOCKERHUB_PROJECT_NAME}` 替换为你实际的 Docker Hub 用户名和仓库名，这些信息来自之前的使用 GitHub Actions 自动化你的构建。

apiVersion: apps/v1
kind: Deployment
metadata:
  name: angular-sample
  namespace: default
spec:
  replicas: 1
  selector:
    matchLabels:
      app: angular-sample
  template:
    metadata:
      labels:
        app: angular-sample
    spec:
      containers:
        - name: angular-container
          image: {DOCKER_USERNAME}/{DOCKERHUB_PROJECT_NAME}:latest
          imagePullPolicy: Always
          ports:
            - containerPort: 8080
          resources:
            limits:
              cpu: "500m"
              memory: "256Mi"
            requests:
              cpu: "250m"
              memory: "128Mi"
---
apiVersion: v1
kind: Service
metadata:
  name: angular-sample-service
  namespace: default
spec:
  type: NodePort
  selector:
    app: angular-sample
  ports:
    - port: 8080
      targetPort: 8080
      nodePort: 30001

此清单定义了两个主要的 Kubernetes 资源，由 --- 分隔

  • 部署：在 pod 中部署一个 Angular 应用程序副本。该 pod 使用由 GitHub Actions CI/CD 工作流构建和推送的 Docker 镜像
    （参考使用 GitHub Actions 自动化你的构建）。
    容器监听端口 `8080`，该端口通常由 Nginx 用于提供你的生产 Angular 应用程序。

  • 服务 (NodePort) 将已部署的 Pod 暴露给您的本地机器。
    它将您的主机上的端口 30001 的流量转发到容器内的端口 8080。
    这使您可以在浏览器中通过 https://:30001 访问应用程序。

注意

要了解更多关于 Kubernetes 对象的信息，请参阅Kubernetes 文档。

部署并检查您的应用程序

按照以下步骤将容器化的 Angular 应用程序部署到本地 Kubernetes 集群并验证其是否正常运行。

步骤 1. 应用 Kubernetes 配置

在你的终端中，导航到 `angular-sample-kubernetes.yaml` 文件所在的目录，然后使用以下命令部署资源：

  $ kubectl apply -f angular-sample-kubernetes.yaml

如果一切配置正确，您将看到部署和服务都已创建的确认信息

  deployment.apps/angular-sample created
  service/angular-sample-service created

这确认了部署和服务都已成功创建，并且现在正在你的本地集群中运行。

步骤 2. 检查部署状态

运行以下命令检查部署状态

  $ kubectl get deployments

你应该看到类似于以下内容的输出

  NAME                 READY   UP-TO-DATE   AVAILABLE   AGE
  angular-sample       1/1     1            1           14s

这确认您的 Pod 已启动并运行，并且有一个可用的副本。

步骤 3. 验证服务暴露

检查 NodePort 服务是否将您的应用程序暴露给本地机器

$ kubectl get services

您应该会看到类似下面的内容：

NAME                     TYPE        CLUSTER-IP       EXTERNAL-IP   PORT(S)          AGE
angular-sample-service   NodePort    10.100.185.105    <none>        8080:30001/TCP   1m

此输出确认您的应用程序可通过 NodePort 在端口 30001 上访问。

步骤 4. 在浏览器中访问您的应用程序

打开浏览器并导航到 https://:30001。

你应该会看到你的生产就绪的 Angular 示例应用程序正在运行 — 由你的本地 Kubernetes 集群提供服务。

步骤 5. 清理 Kubernetes 资源

测试完成后，您可以使用以下命令删除部署和服务

  $ kubectl delete -f angular-sample-kubernetes.yaml

预期输出

  deployment.apps "angular-sample" deleted
  service "angular-sample-service" deleted

这确保您的集群保持干净并为下一次部署做好准备。

摘要

在本节中，你学习了如何使用 Docker Desktop 将你的 Angular 应用程序部署到本地 Kubernetes 集群。这种设置允许你在将其部署到云端之前，在类似于生产环境的环境中测试和调试你的容器化应用程序。

你完成了什么

  • 为你的 Angular 应用程序创建了 Kubernetes Deployment 和 NodePort Service
  • 使用 kubectl apply 在本地部署应用程序
  • 验证了应用程序正在运行并可通过 https://:30001 访问
  • 测试后清理了您的 Kubernetes 资源

探索官方参考资料和最佳实践以提升您的 Kubernetes 部署工作流程

© . This site is unofficial and not affiliated with Kubernetes or Docker Inc.