docker部署个人网站项目记录(前后端分离)

背景

项目是前后端分离,前端有三部分,分别是

  • 个人网站(blog)
  • 网站后台管理系统(admin)
  • 数据大屏(datascreen)

后端是基于nodejs写的后台服务

  • 后台接口服务(todo-nodejs-api)

另外,数据库使用了mysql,nginx做转发代理

之前采用常规部署,近期更换了个服务器,用docker方案重新部署,记录一下

目录结构

如下结构

docker配置

todo-nodejs-api 中的 Dockerfile如下

powershell 复制代码
FROM node:14.18.1
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
CMD ["node", "app.js"]

docker-compose.yml 配置如下

MYSQL_ROOT_PASSWORD 和 MYSQL_DATABASE 分别是数据库密码和数据库名称

powershell 复制代码
version: '3'
services:
  mysql:
    image: mysql:8.0.35
    container_name: mysql-container
    restart: unless-stopped
    environment:
      MYSQL_ROOT_PASSWORD: xxxxxx
      MYSQL_DATABASE: xxxxxx
    ports:
      - '3307:3306'
    volumes:
      - /var/lib/mysql:/var/lib/mysql # mysql数据卷挂载

  todo-nodejs-api:
    build: ./todo-nodejs-api
    container_name: todo-nodejs-api-container
    restart: unless-stopped
    ports:
      - '8888:8888'
    depends_on:
      - mysql

  nginx:
    image: nginx:latest
    container_name: nginx-container
    ports:
      - '80:80'
      - '443:443' 
    volumes:
      - ./nginx/nginx.conf:/etc/nginx/nginx.conf:ro
      - ./nginx/cert:/etc/nginx/cert:ro
      - ./web/admin:/usr/share/nginx/html/admin:ro
      - ./web/blog:/usr/share/nginx/html/blog:ro
      - ./web/datascreen:/usr/share/nginx/html/datascreen:ro
    depends_on:
      - todo-nodejs-api

nginx配置

nginx.conf

bash 复制代码
user nginx;
worker_processes auto;
error_log /var/log/nginx/error.log;
pid /run/nginx.pid;

include /usr/share/nginx/modules/*.conf;

events {
  worker_connections 1024;
}

http {
  log_format main
    '$remote_addr - $remote_user [$time_local] "$request" '
    '$status $body_bytes_sent "$http_referer" '
    '"$http_user_agent" "$http_x_forwarded_for"';

  access_log /var/log/nginx/access.log main;

  sendfile on;
  tcp_nopush on;
  tcp_nodelay on;
  keepalive_timeout 65;
  types_hash_max_size 4096;

  include /etc/nginx/mime.types;
  default_type application/octet-stream;

  include /etc/nginx/conf.d/*.conf;
  upstream server_api {
    server 123.57.193.148:8888 weight=1;
  }

  server {
    listen 80;
    listen [::]:80;
    server_name www.liuzepeng.com;
    root /usr/share/nginx/html;

    error_page 404 /404.html;
    location = /404.html {
    }

    error_page 500 502 503 504 /50x.html;
    location = /50x.html {
    }
    return 301 https://$host$request_uri;
  }

  server {
    listen 443 ssl;
    server_name www.liuzepeng.com;

    ssl_certificate /etc/nginx/cert/liuzepeng.pem;
    ssl_certificate_key /etc/nginx/cert/liuzepeng.key;

    ssl_session_cache shared:SSL:1m;
    ssl_session_timeout 5m;

    ssl_ciphers HIGH:!aNULL:!MD5;
    ssl_prefer_server_ciphers on;

    location /api/ {
      proxy_pass http://server_api/;
      proxy_set_header Host $http_host;
      proxy_set_header x-real-ip $remote_addr;
      proxy_set_header x-forwarded-for $proxy_add_x_forwarded_for;
    }

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

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

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

问题记录

记录部署过程中遇到的一些问题

COPY 文件不生效

一开始我在web下创建了一个Dockerfile文件,想把web下的目录复制到容器中

powershell 复制代码
#将文件复制到 Nginx 默认的静态文件目录中
COPY admin /usr/share/nginx/html/admin/
COPY blog /usr/share/nginx/html/blog/
COPY datascreen /usr/share/nginx/html/datascreen/

进入nginx容器查看 /usr/share/nginx/html/ 目录下 发现并没有copy过去,没有这三个目录

后来发现,进错了容器,web里面启动的这个容器内 /usr/share/nginx/html/ 路径下确实有这三个文件

Dockerfile 只用在了 web 这个 service 里面,而nginx使用的是官网提供的镜像 nginx:latest ,两个不同的容器,不能直接在nginx容器中去访问web容器服务中的目录!!!

后面修改了一下,直接在nginx配置中把目录挂载到nginx容器内,去掉了web下的Dockerfile

shell 复制代码
 nginx:
    image: nginx:latest
    container_name: nginx-container
    ports:
      - '80:80'
      - '443:443' 
    volumes:
      - ./nginx/nginx.conf:/etc/nginx/nginx.conf:ro
      - ./nginx/cert:/etc/nginx/cert:ro
      - ./web/admin:/usr/share/nginx/html/admin:ro
      - ./web/blog:/usr/share/nginx/html/blog:ro
      - ./web/datascreen:/usr/share/nginx/html/datascreen:ro
    depends_on:
      - todo-nodejs-api

docker运行的mysql本地无法链接

  • 先看一下mysql容器是否启动了

    bash 复制代码
    docker ps
  • 发现启动了,进入mysql容器

    bash 复制代码
    docker exec -it mysql-container /bin/bash
  • 进入mysql

    bash 复制代码
    mysql -uroot -p
    Enter password:xxxxxxx
  • 查看host和user

    bash 复制代码
    select host,user from mysql.user;

    确保 root 的 host 为 % 即代表可以远程连接

  • 切换到mysql

    bash 复制代码
    use mysql;
  • 给root分配远程访问权限

    bash 复制代码
    GRANT ALL PRIVILEGES ON *.* TO root@'%' WITH GRANT OPTION;
    • GRANT:赋权命令

    • ALL PRIVILEGES:当前用户的所有权限

    • ON:介词

    • .:当前用户对所有数据库和表的相应操作权限

    • TO:介词

    • 'root'@'%':权限赋给 root 用户,所有 ip 都能连接

    • WITH GRANT OPTION:允许级联赋权

  • 强制刷新权限

    bash 复制代码
    FLUSH PRIVILEGES;
  • 注意记得去开放对应的端口,这里映射的是3307

  • navicat连接就可以了

相关推荐
KIDULT°7 小时前
MySQL系列 (1):数据库原理
运维·数据库·mysql·云计算
wewowilling10 小时前
认识微服务
java·运维·微服务·springcloud
玖石书10 小时前
Ubuntu 24.04 UFW 全命令攻略:从入门到端口开放实战
linux·运维·ubuntu
weifont12 小时前
自动化抓取和上架商品:能不动手,就少动手
运维·前端·自动化
拂拉氏12 小时前
【知识讲解】 Linux之动静态库的了解
linux·运维·服务器·动静态库
Mikko713 小时前
Linux 重启后日志没了?进程被 OOM 杀了去哪看?logrotate 之后日志还往旧文件写?三台真机实测日志与性能排查
linux·运维·centos
光依旧13 小时前
发版就掉请求?Spring Boot优雅停机的四步
运维·spring boot·nginx·高可用·优雅停机·mcp server
yichengerp15 小时前
电子行业常用erp系统有哪些?推荐适合中小电子厂的易呈erp软件,操作简单,易落地
大数据·运维·人工智能·云计算·制造
天国梦15 小时前
国密门禁品牌怎么选?2026年最新3个避坑要点
运维·服务器·数据库·python
信可维16 小时前
自动化操作多平台账号:登录态、双会话与 User Data 的 3 个坑
运维·自动化