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连接就可以了

相关推荐
SelectDB11 小时前
Litefuse 开源并推出单进程轻量模式,25 秒就能跑起来的 Agent 可观测与评估平台
运维·后端·自动化运维
XIAOHEZIcode2 天前
Linux系统鼠标偏移常见原因以及修复方案
linux·运维·游戏
用户0328472220702 天前
如何搭建本地yum源(上)
运维
大树885 天前
金刚石散热越强,管路越先见顶
大数据·运维·服务器·人工智能·ai
摇滚侠5 天前
Linux CentOS7 rpm 安装 MySQL 5.7
linux·运维·mysql
霸道流氓气质5 天前
领域驱动设计(DDD)在 Spring Boot 微服务中的实践指南
运维·spring boot·微服务
Inhand陈工6 天前
基于台达PLC与映翰通IG502的智慧水产养殖精准投喂与远程运维解决方案
运维·人工智能·物联网·阿里云·信息与通信
酣大智6 天前
ARP代理--工作原理
运维·网络·arp·arp代理
shushangyun_6 天前
2026年快消品B2B系统推荐:支持终端门店订货、促销政策自动化的工具?
java·运维·网络·数据库·人工智能·spring·自动化
施努卡机器视觉6 天前
SNK施努卡侧滑门锁上滑轮总成自动化装配线,从零件到组件,全流程精密制造方案
运维·自动化·制造