前端項目部署

使用 docker compose 部署單頁面應用，我們再上一遍文章介紹過。鏈接

創建docker-compose.yaml

version: "3.0"

services:
  vote:
    container_name: vote
    build:
      context: vote
      dockerfile: Dockerfile
    ports:
      - 8000:80
    restart: on-failure
    networks:
      - frontend
    depends_on:
      - server

networks:
  frontend:

創建 Dockerfile

前端項目有兩種方式構建 dockerfile

1. 前端項目打包好后，再使用 nginx 構建

   FROM nginx
   COPY default.conf /etc/nginx/conf.d/default.conf
   COPY dist /usr/share/nginx/build
   

2. 多階段構建（打包也由dockerfile 完成）

   FROM node:14-alpine as builder
   WORKDIR /app
   
   COPY package.json package-lock.json /app/
   RUN npm install --registry=https://registry.npm.taobao.org
   
   COPY . /app
   RUN npm run build
   
   FROM nginx
   COPY default.conf /etc/nginx/conf.d/default.conf
   COPY --from=builder app/dist /usr/share/nginx/build
   

本文使用了第一種方式，第二種方式下載依賴、打包構建時間有點長，感興趣的小伙伴可以試試

創建 default.conf

server {
    listen       80;
    listen  [::]:80;
    server_name  localhost;

    access_log  /var/log/nginx/host.access.log  main;
    error_log  /var/log/nginx/error.log  error;

    location ^~ /api {
        proxy_set_header  Host $host;
        proxy_set_header  X-Real-IP $remote_addr;
        proxy_set_header  X-Forwarded-Proto https;
        rewrite ^/api/(.*)$ /$1 break;
        proxy_pass http://server:7001;
    }

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

    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root /usr/share/nginx/html;
    }
}

前端項目部署構建文件創建完成了，docker-compose.yaml文件還缺少 server 項目

后端項目部署

創建 docker-compose.yaml

version: "3.0"

services:
  redis:
    container_name: redis
    image: redis
    ports:
      - "6380:6379"
    restart: on-failure
    volumes:
      - ./data/redis/data:/data
      - ./redis/redis.conf:/usr/local/etc/redis/redis.conf
      - ./data/redis/logs:/logs
    command: redis-server /usr/local/etc/redis/redis.conf
    networks:
      - my-server

  mongodb:
    container_name: mongodb
    build:
      context: mongo
      dockerfile: Dockerfile
    restart: on-failure
    ports:
      - "27019:27017"
    environment:
      MONGO_INITDB_ROOT_USERNAME: root
      MONGO_INITDB_ROOT_PASSWORD: 123456
      MONGO_INITDB_DATABASE: eggadmin
    volumes:
      - ./data/mongodb/db:/data/db
      - ./data/mongodb/log/:/var/log/mongodb
    networks:
      - my-server

  server:
    container_name: server
    build:
      context: egg-admin
      dockerfile: Dockerfile
    ports:
      - "3000:7001"
    restart: on-failure
    networks:
      - my-server
      - frontend
    depends_on:
      - mongodb
      - redis
networks:
  my-server:
  frontend:

server 項目依賴mongodb、redis 項目，docker-compose up 啟動時會先啟動mongodb、redis 項目

mongodb 配置

mongodb 的 Dockerfile 文件

FROM mongo
ENV WORKSPACE /usr/local/work
ENV AUTO_RUN_DIR /docker-entrypoint-initdb.d
ENV INSTALL_MONGO_SHELL setup.sh
RUN mkdir -p $WORKSPACE
COPY ./dump $WORKSPACE/
COPY ./$INSTALL_MONGO_SHELL $AUTO_RUN_DIR/
RUN chmod a+x $AUTO_RUN_DIR/$INSTALL_MONGO_SHELL

mongodb 的 setup.sh

#!/bin/bash
mongorestore -d eggadmin --drop $WORKSPACE/eggadmin

mongodb 數據庫默認角色說明

1. 數據庫用戶角色：read、readWrite
2. 數據庫管理角色：dbAdmin、dbOwner、userAdmin
3. 集群管理角色：clusterAdmin、clusterManager、clusterMonitor、hostManager
4. 備份恢復角色：backup、restore
5. 所有數據庫角色： readAnyDatabase、readWriteAnyDatabase、userAdminAnyDatabase、dbAdminAnyDatabase
6. 超級用戶角色：root

連接到數據庫

mongodb://root:123456@127.0.0.1:27017/eggadmin

server 配置

server 的 Dockerfile 文件

# node鏡像
FROM node:14-alpine

# 設置工作目錄
WORKDIR /app

# 拷貝package.json文件到工作目錄
# !!重要：package.json需要單獨添加。
# Docker在構建鏡像的時候，是一層一層構建的，僅當這一層有變化時，重新構建對應的層。
# 如果package.json和源代碼一起添加到鏡像，則每次修改源碼都需要重新安裝npm模塊，這樣木有>必要。
# 所以，正確的順序是: 添加package.json；安裝npm模塊；添加源代碼。
COPY package.json /app/

# 安裝npm依賴(使用淘寶的鏡像源)
# 如果使用的境外服務器，無需使用淘寶的鏡像源，即改為`RUN npm i`。
RUN npm install --registry=https://registry.npm.taobao.org

COPY . /app

CMD ["npm","start"]

egg 項目 config.prod.js 文件配置如下

 config.mongoose = {
    client: {
      url: "mongodb://mongodb:27017/eggadmin",
      options: {
        useUnifiedTopology: true,
      }
    }
  };

  config.redis = {
    client: {
      port: 6379,
      host: "redis",
      password: "redispassword",
      db: 0,
    }
  };

有細心的同學會發現mongodb 對外暴露的端口是27019，而我們這配置的是 27017，這是因為我們在docker-compose.yaml 文件配置了networks，server、mongodb、redis 處于同一網絡 my-server 下，host 就是構建的容器名，如mongodb，redis，端口就是容器的端口，如27017，6379 ... 同理，前端項目 server 、vote 處于同一網絡 frontend 下，所以 前端項目 default.conf 的 proxy_pass 配置 為http://server:7001;

redis 配置

redis 的 redis.conf

# bind 127.0.0.1 ::1
requirepass redispassword

啟動

docker-compose up -d