如何将 node.js 应用程序 Dockerize、使用 Kubernetes 编排容器、设置 CI/CD 并在云上部署

素颜马尾好姑娘i 2024-03-16 19:36 43阅读 0赞

##  ##

在本文中，我将向您介绍如何对 node.js 应用程序进行 docker 化、使用 Kubernetes 编排容器、使用持续集成自动交付、使用 CircleCI 进行持续交付 (CI/CD) 以及部署到 Google Cloud 平台

这也是我刚刚结束的 She Code Africa Cloud School Cohort 4 的最终项目。

要求

> [CircleCI上的][CircleCI][Docker Desktop][CircleCI]  
> Account本地机器上下载的[Kubectl][CircleCI] Cloud account，本文我使用了[Google cloud][CircleCI] 谷歌云终端[GitHub上的][CircleCI][Google SDK][CircleCI] Account 文本编辑器，我使用了[VS-code][CircleCI]。您可以使用任何您熟悉的文本编辑器。  
>   
>   
>   
>

#### 第 1 步：构建应用程序 ####

我们要做的第一件事是构建应用程序。这个应用程序将是一个简单的索引文件和一个 node.js 文件。  
复制并粘贴这些代码并保存在 index.html 文件中

<span style="color:var(--syntax-text-color)"><span style="color:var(--syntax-text-color)"><code><html>
     <head>
      <title>My first CICD Project</title>
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css" rel="stylesheet">
     </head>
     <body>
    
      <div class="col-md-10 col-md-offset-1" style="margin-top:20px">
       <div class="panel panel-primary">
         <div class="panel-heading">
           <h3 class="panel-title">MY first CICD Project</h3>
         </div>
          <div class="panel-body">
           <div class="alert alert-success">
              <p>This is a basic app used to demonstrate CI/CD on Google Cloud using K8s, CircleCI and Docker </p>
           </div>
             <div class="col-md-9">
               <p>Author:</p>
               <div class="col-md-3">
                 <a href="https://twitter.com/delan_hype">Dooshima</a>
               </div>
             </div>
          </div>
      </div>
      </div>
    
    <script src="https://code.jquery.com/jquery-3.1.1.slim.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js"></script>
     </body>
    </html>
    </code></span></span>

node.js 文件将包含以下代码，将代码复制并粘贴到 server.js 中

<span style="color:var(--syntax-text-color)"><span style="color:var(--syntax-text-color)"><code>const express = require('express');
    const path = require('path');
    const morgan = require('morgan');
    const bodyParser = require('body-parser');
    
    /* eslint-disable no-console */
    
    const port = process.env.PORT || 3000;
    const app = express();
    
    app.use(morgan('dev'));
    app.use(bodyParser.json());
    app.use(bodyParser.urlencoded({ extended: 'true' }));
    app.use(bodyParser.json({ type: 'application/vnd.api+json' }));
    
    app.use(express.static(path.join(__dirname, './')));
    
    app.get('*', (req, res) => {
      res.sendFile(path.join(__dirname, './index.html'));
    });
    
    app.listen(port, (err) => {
      if (err) {
        console.log(err);
      } else {
        console.log(`App at: http://localhost:${port}`);
      }
    });
    module.exports = app;
    </code></span></span>

接下来要做的是创建一个 package.json 文件，将这段代码复制粘贴到文件中

<span style="color:var(--syntax-text-color)"><span style="color:var(--syntax-text-color)"><code>{
        "name": "dockerized nodejs application",
        "version": "1.0.0",
        "description": "This is a basic guide on dockerizing a node.js app, deploying to gcloud and setting a CI/CD.",
        "main": "server.js",
        "scripts": {
            "start": "nodemon",
            "test": "mocha"
        },
        "keywords": [
            "gcloud",
            "node"
        ],
        "author": "Dooshima",
        "license": "MIT",
        "dependencies": {
            "body-parser": "^1.17.2",
            "express": "^4.15.3",
            "morgan": "^1.8.2"
        },
        "devDependencies": {
            "chai": "^4.1.2",
            "mocha": "^10.2.0",
            "request": "^2.88.0"
        }
    }
    </code></span></span>

为了在应用程序发生变化时保持更新，我们将使用 nodemon，因此我们需要安装 nodemon  
运行代码`npm install nodemon`。  
应用程序运行需要其他依赖项，安装它们，运行代码`npm install .`，这将安装所有依赖项。  
干得好，我们已经完成了应用程序的构建，接下来是确保应用程序在本地运行。  
运行代码`npm start`  
如果您按照要求执行并且没有遗漏任何步骤，您的终端  
应该会为您提供类似于以下内容的输出：

<span style="color:var(--syntax-text-color)"><span style="color:var(--syntax-text-color)"><code>> dockerized nodejs application@1.0.0 start
    > nodemon
    [nodemon] 2.0.22
    [nodemon] to restart at any time, enter `rs`
    [nodemon] watching path(s): *.*
    [nodemon] watching extensions: js,mjs,json
    [nodemon] starting `node server.js`
    App at: http://localhost:3000
    </code></span></span>

导航到您的应用程序正在运行的端口，您可以在浏览器中查看您的应用程序。

![a260ebea2fdeb2d28ee0304095020687.png][]

#### 第 2 步：Docker 化应用程序 ####

现在我们的应用程序已启动并运行，接下来我们要做的是将应用程序 dockerize  
在此应用程序的要求部分中，如果您的本地计算机上还没有 Docker Desktop，则有一个下载 Docker Desktop 的链接。  
对图像进行 docker 化时，我们需要在您的根目录中有一个 Dockerfile；还请记住，Dockerfile 以其开头`From`，指示应从何处获取基础映像。  
出于此应用程序的目的，我们的基础映像是节点，因为我们的应用程序是 node.js 应用程序  
复制下面的代码并粘贴到将用于构建映像的 Dockerfile

<span style="color:var(--syntax-text-color)"><span style="color:var(--syntax-text-color)"><code>FROM node
    ENV NPM_CONFIG_LOGLEVEL warn
    RUN mkdir -p /usr/src/app
    EXPOSE 3000
    WORKDIR /usr/src/app
    ADD package.json /usr/src/app/
    RUN npm install --production
    ADD . /usr/src/app/
    ENTRYPOINT ["npm", "start"]
    </code></span></span>

docker build 命令将用于构建 docker 镜像。  
我正在使用 Visual Studio 代码终端来构建我的图像，因为我已经在 VS 代码上安装了 Docker。为此，您可以查看这篇[文章][Link 1]。或者，您可以使用 PowerShell 终端（确保您位于文件所在的目录中）。  
运行`docker build -t sca-image .`以构建您的图像，其中“sca-image”是我们图像的名称。  
一旦构建成功，您将看到*构建完成*以及在终端中构建图像所花费的时间。

检查您的 Docker 桌面，如果您的构建成功，您将在图像存储库中看到图像，如下所示干得 好，我们已经对我们的图像进行了 docker 化，让我们来看看我们的 docker 化图像。 当您的图像被 docker 化并运行时，它已成为一个容器，您可以在 Docker 桌面的容器部分中看到它。要查看正在运行的图像（容器），您将运行运行图像的 命令。 在您的 Docker Desktop 中，图像的状态应该从第一个图像中的**未使用变为正在****使用**，如下图所示： 单击图像状态，**正在使用**

![1eebcdaaebeee43b12bc4cd2610a6cba.png][]

`docker run -d -P --name docker sca-image`  
  
  
或转到 Docker 桌面的容器部分，以便您可以看到您的容器。 在 docker 容器的端口部分下，单击端口，这样您就可以看到在浏览器中运行的 dockerized 图像 dockerized 图像的端口 (32768) 与 node.js 应用程序的正常端口 (3000) 不同。

我们的 dockerized 在 Docker Desktop 上运行，但是，我们希望将它部署到云平台上。  
我将使用谷歌云平台来寻找这篇文章。  
如果您还没有帐户，则在“要求”部分下有一个在 Google 云平台上注册的链接。  
在谷歌平台上，谷歌容器注册表是我们的图像将被托管的地方。  
在您的 Google 云平台上，创建一个项目或选择您选择的任何项目（如果您已有项目）  
要创建一个项目，请查看这篇[文章][Link 1]  
要将图像推送到 Google 云平台，我将使用 Google 云 SDK。  
跑过`gcloud init`在 Google 云终端中初始化 gcloud 并按照终端中的说明将您的项目设置为与您正在使用的项目 ID 相对应。  
在您的 Google 云平台上，启用容器注册表 API，以便可以推送图像，如下图所示：

![2485151ba9aca328066f0be1623123f4.png][]

下一步是将镜像推送到容器注册表，但在此之前，我们将首先标记镜像。

`docker tag sca-image gcr.io/sca-project-389601/sca-image:0.1.0`

sca-project-389601 是您可以从项目概述中获得的项目 ID  
*gcr.io*是主机名  
*sca-image:0.1.0*是图像名称

现在图片已经打上标签了，我们将使用这行代码将其推送到谷歌云平台  
`docker -- push gcr.io/sca-project-389601/sca-image:0.1.0`

如果您的推送成功，您的图像应该出现在您存储库的容器注册表中

![6af22a384204036e5437a15ed8b4dd35.png][]

走到这一步做得很好。

#### 第 3 步：使用 Kubernetes 进行容器编排 ####

现在我们已经成功地将我们的应用程序 docker 化并部署在 Google 云平台上，我们将需要使用 Kubernetes 来编排我们的容器。  
要运行 Kubernetes，您需要在本地计算机上安装 Kubectl，否则您会遇到错误。  
右键单击您的 Google SDK，以管理员身份运行并通过运行这行代码来安装 kubectl 要`gcloud components install kubectl`  
检查 kubectl 是否已安装，请通过运行检查版本，`kubectl version --client --output=yaml`这应该会在 yaml 中为您提供输出  
接下来我们要做的是创建这行代码将用于创建的 Kubernetes 集群要设置或检查您的区域/区域，您可以[在此处][Link 1]  
`gcloud container clusters create <CLUSTER_NAME> --zone <TIME_ZONE> --project <PROJECT_ID>`  
查看 确保将您的集群区域设置为与您的项目区域相同。  
  
查看这篇[文章][CircleCI]来设置您的项目区域/区域  
如果您的集群创建成功，您的 SDK Shell 将返回一个输出，为您提供有关位置、主 IP、节点数、状态等的详细信息。这行  
代码`gcloud container clusters list`还可以为您提供您拥有的集群列表及其状态。

Kubernetes 配置

Kubernetes 配置是指 Kubernetes 提供的用于配置 Pod 的资源。[您可以在此处][CircleCI]查看更多详细信息  
下面的代码将用于配置我们的 Kubernetes。复制并粘贴到 deployment.yaml 文件中

<span style="color:var(--syntax-text-color)"><span style="color:var(--syntax-text-color)"><code>apiVersion: v1
    kind: Service
    metadata:
      name: sca-image
      labels:
        app: sca-image
    spec:
      ports:
        - port: 3000
      selector:
        app: sca-image
        tier: frontend
      type: LoadBalancer
    ---
    apiVersion: apps/v1
    kind: Deployment
    metadata:
      name: sca-image
      labels:
        app: sca-image
    spec:
      selector:
        matchLabels:
          app: sca-image
          tier: frontend
      strategy:
        type: Recreate
      template:
        metadata:
          labels:
            app: sca-image
            tier: frontend
        spec:
          containers:
          - image: gcr.io/sca-project-389601/sca-image:0.1.0
            name: sca-image
            ports:
            - containerPort: 3000
              name: sca-image
    </code></span></span>

始终记得在声明配置时检查最新的 Kubernetes API。在您的终端中  
运行以创建您的部署。 确保部署成功很重要。`kubectl create -f deployment.yaml`

运行  
`kubectl get po`以获取 pod  
`kubectl get svc`以获取服务并  
`kubectl get deployment`获取部署

你的终端应该给你这样的输出 导航到图像的外部 IP，你应该看到你的图像在你的浏览器中运行

![e57efe0b54bd6e594fe5e21b1171831c.png][]

这是我的：

![cee4b38d711c74e4bbdb9f717c694094.png][]

在我的浏览器的搜索栏中，您将看到与我终端中图像的外部 IP 相对应的外部 IP。  
我们创建的集群也可以在谷歌云平台上查看

![5e38428507f08be700e1cca60e635f85.png][]

到目前为止做得很好，我们快完成了。  
接下来我们设置自动化过程，以便可以持续部署对应用程序的更改。为此，我们将使用 CircleCI。

#### 第 4 步：使用 CircleCI 设置自动化 ####

为了在 CircleCI 上设置自动化，将使用脚本文件来帮助部署，CircleCI 将作为部署中的构建步骤运行。  
将这些代码复制并粘贴到 deployment.sh 文件中，将用作脚本文件

<span style="color:var(--syntax-text-color)"><span style="color:var(--syntax-text-color)"><code># !/bin/bash
    set -e
    echo "Deploying to ${DEPLOYMENT_ENVIRONMENT}"
    echo $ACCOUNT_KEY_STAGING > service_key.txt
    base64 -i service_key.txt -d > ${HOME}/gcloud-service-key.json
    gcloud auth activate-service-account ${ACCOUNT_ID} --key-file ${HOME}/gcloud-service-key.json
    gcloud config set project $PROJECT_ID
    gcloud --quiet config set container/cluster $CLUSTER_NAME
    gcloud config set compute/zone $CLOUDSDK_COMPUTE_ZONE
    gcloud --quiet container clusters get-credentials $CLUSTER_NAME
    docker build -t gcr.io/${PROJECT_ID}/${REG_ID}:$CIRCLE_SHA1 .
    gcloud docker -- push gcr.io/${PROJECT_ID}/${REG_ID}:$CIRCLE_SHA1
    kubectl set image deployment/${DEPLOYMENT_NAME} ${CONTAINER_NAME}=gcr.io/${PROJECT_ID}/${REG_ID}:$CIRCLE_SHA1
    echo " Successfully deployed to ${DEPLOYMENT_ENVIRONMENT}"
    </code></span></span>

设置 CircleCI 配置：

为部署构建提供的脚本文件是脚本文件和未定义的变量。变量将被定义并包含在 config.yml 文件中，该文件也将用于部署应用程序。  
在您的根目录中创建一个 .circleci 文件夹，并在该文件夹中使用以下代码创建一个 .circleci/config.yml 文件：

<span style="color:var(--syntax-text-color)"><span style="color:var(--syntax-text-color)"><code>version: 2
    jobs:
      build:
        docker:
          - image: wecs/circle-ci-gcloud-node:0.1.0
        working_directory: ~/workspace
        environment:
          DEPLOYMENT_NAME: sca-deploy
          PROJECT_ID: sca-project-389601
          CLUSTER_NAME: sca-cluster
          CLUSTER_NAME_STAG: sca-stag
          CLOUDSDK_COMPUTE_ZONE: us-west4-a 
          CONTAINER_NAME: sca-container
          IMAGE: sca-image
          REG_ID: sca-image
          REG_ID_PROD: sca-prod
          IMG_TAG: 0.1.0
          PROJECT_NAME: sca-project
          DEPLOYMENT_ENVIRONMENT: staging
        steps:
          - checkout
          - setup_remote_docker
          - restore_cache:
              keys:
              - v1-dependencies-{
         { checksum "package.json" }}
              - v1-dependencies-
          - run:
              name: Install node packages
              command: |
                npm install
    
          - run:
              name: Start app
              command: |
                npm start &
          - run:
              name: Run tests
              command: |
                npm test
          - restore_cache:
              keys:
              - v1-dependencies-{
         { checksum "package.json" }}
              - v1-dependencies-
          - save_cache:
              paths:
                - node_modules
              key: v1-dependencies-{
         { checksum "package.json" }}
    
          - run:
              name: Build and Deploy
              command: |
                if [ "${CIRCLE_BRANCH}" == "master" ]; then
                  ./deployment.sh
                fi  
    </code></span></span>

将代码推送到 GitHub 存储库。

现在我们准备设置 CI/CD 管道  
在要求部分，如果您还没有帐户，则有一个在 CircleCI 上注册的链接。  
完成后，在项目部分下使用您正在处理的代码设置项目。

![8d7848c4e2625e59d44addc511fdab04.png][]

为了成功构建，CircleCI 需要在谷歌云上进行自我验证。  
在您的 Google 云控制台中，创建一个服务帐户

![0a1f6bc9aa25c0b18fffca0d94592dde.png][]

在刚刚创建的服务帐户的密钥部分下，需要一个 .json 密钥来验证 CircleCI，单击密钥并选择添加密钥，这将允许您添加一个新密钥。 完成后，将下载 json 文件。复制文件的内容并在您的项目设置下，单击环境变量复制并粘贴您之前下载的 json 密钥的内容。

![1be90b7cd0a33828955ba65f984d7033.jpeg][]

完成所有这些后，通过选择带有代码的存储库来设置项目 我将在我的存储库中使用 config.yml 文件 单击设置项目并等待查看项目的状态

![b9a1b753e8164718b98f742b757edc1e.png][]

你可以编辑你的 index.html 文件来观察你的管道将如何运行  
这样，我们就完成了 CI/CD 管道的设置

干得好，感谢您一直关注到最后。

在我为您带来 DevOps 内容时，请继续查看此博客

[CircleCI]: https://zhifj.com
[a260ebea2fdeb2d28ee0304095020687.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/ad8b5b71401a43a0956bcc260c9f42a6.png
[Link 1]: http://telegeram1.com
[1eebcdaaebeee43b12bc4cd2610a6cba.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/fea7d05784e54ae5b1ee02205094b26b.png
[2485151ba9aca328066f0be1623123f4.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/836e6ab13a694141b97526836ab3a5d4.png
[6af22a384204036e5437a15ed8b4dd35.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/0c31ed3ed26b405d94e54f11dd6ac59b.png
[e57efe0b54bd6e594fe5e21b1171831c.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/be93cc2a948741a888fcd1021cc5e87f.png
[cee4b38d711c74e4bbdb9f717c694094.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/20b04e1587c44131b5de688f0f9ce52d.png
[5e38428507f08be700e1cca60e635f85.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/d4dbd14643fd47e58b57a45fe48c202e.png
[8d7848c4e2625e59d44addc511fdab04.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/80f8a6a79b2a45b9af67257d98a0747e.png
[0a1f6bc9aa25c0b18fffca0d94592dde.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/aa1cec35bc0c44fab012835eb5889658.png
[1be90b7cd0a33828955ba65f984d7033.jpeg]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/a34de11346e0402096c0af4828b5f7c1.png
[b9a1b753e8164718b98f742b757edc1e.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/db60d772491847f09675e98e545442b6.png