Docker部署项目 vue+django+mysql+redis

618 阅读7分钟

Vue项目一般在服务器部署采用nginx, 在docker内拉取镜像nginx

# 下载镜像
docker pull nginx
# 查看镜像
docker images
# 删除nginx镜像
docker rmi nginx
# 创建运行该镜像
docker run -d --name nginx -p 80:80 nginx
# 查看运行的容器
docker ps
# 停止nginx容器
docker stop nginx
# 删除容器 -f即使运行依然删除
docker rm -f nginx
# 再次启动nginx,run是创建镜像,所以使用start
docker start nginx
# 查看nginx 日志,-f持续输出 ctrl+c结束
docker logs -f nginx
# 现在你可试着使用浏览器,输入你的云服务器的ip地址,就可以看到欢迎页面 Welcome to nginx!记得打开云服务器的80端口,想必你的防火墙早已关闭

想要删除镜像,必须先删除容器也就是说按下面的步骤
dokcer ps 
# 停止nginx容器
docker stop nginx
docker ps -a 
# 删除容器
docker rm nginx
# 删除镜像
docker rmi nginx:latest

nginx.png

# 进入容器内部
docker exec -it nginx bash
# 退出
exit

nginx服务器有两个地方,存放静态资源和配置

数据卷(volume)学习

数据卷一

数据卷(volume)是一个虚拟目录,是容器内目录宿主机目录之间映射的桥梁。

# nginx 容器的目录
/etc/nginx/conf.d
/usr/share/nginx/html

# 创建的数据卷在哪呢
# 在宿主机文件系统的
/var/lib/docker/volumes/html/_data
/var/lib/docker/volumes/conf/_data

# 做挂载关联
# 需要在创建时就关联容器内目录,所以需要删除之前的nginx容器
docker rm -f nginx
# 创建了名为html 数据卷
docker run -d --name nginx -p 80:80 -v html:/usr/share/nginx/html --network heima nginx
# 查看数据卷详情
docker volume ls
# 查看html具体的数据内容
docker volume inspect html
# 会出现"Mountpoint": "/var/lib/docker/volumes/html/_data",该目录就是html目录
# 找到你的vue项目,将dist文件下的所有文件,复制粘贴到/var/lib/docker/volumes/html/_data下 -rf 出现相同的内容强制覆盖掉
cp -rf /root/data/www/Blog/static/dist/* /var/lib/docker/volumes/html/_data
# 查看conf具体的数据内容
# 删除容器的同时删除数据卷,本地的数据卷不会自动随着镜像删除而删除
docker rm -v nginx
# conf如何配置,如果下面的不行看最底下的文件
    1.6 最后还要在 serve 对象里面加一个  

    location /api/ {    
        proxy_pass http://192.168.1.91:8080/
    }  

    <http://192.168.1.91:8080/>这个就是后端的接口, 作用是在nginx 下设置代理

可参考 以下为GPT生成

前后端分离的项目vue,需要想后端拿数据后端的地址为http://192.168.1.91:8080/app01/, nginx的conf配置文件怎么修改
如果你的 Vue 前端需要与后端进行通信,并且后端的地址为 `http://192.168.1.91:8080/app01/`,你可以通过配置 Nginx 的反向代理来将前端的请求代理到后端的地址上。

下面是一个示例 Nginx 配置,用于将前端请求代理到后端:
server {
    listen 80;
    server_name your_domain.com;

    location / {
        # 设置前端静态文件目录
        root /path/to/your/vue-project/dist;
        index index.html;
        try_files $uri $uri/ /index.html;
    }

    location /app01/ {
        # 设置后端地址
        proxy_pass http://192.168.1.91:8080/app01/;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }
}
这个配置文件假设你的 Vue 项目已经打包成静态文件,并且放置在 `/path/to/your/vue-project/dist` 目录下。Nginx 将会处理所有的前端请求,并将以 `/app01/` 开头的请求代理到后端地址 `http://192.168.1.91:8080/app01/` 上。

在你的实际部署中,请将 `your_domain.com` 替换为你的域名或者服务器 IP 地址,并根据你的项目结构和需求进行相应的调整。

数据卷二:本地目录挂载

# 查看容器的详情
docker inspect nginx
# Mounts 数据卷挂载

 本地目录或文件必须以 `/` 或 `./`开头,如果直接以名字开头,会被识别为数据卷名而非本地目录名。
 # 挂载本地目录
-v 本地目录:容器内目录
# 挂载本地文件
-v 本地文件:容器内文件

mysql数据卷挂载

# MySQL configuration file
/etc/mysql/conf.d
# Initializing a fresh instance
/docker-entrypoint-initdb.d
# Where to Store Data
/var/lib/mysql
  • 挂载/root/mysql/data到容器内的/var/lib/mysql目录
  • 挂载/root/mysql/init到容器内的/docker-entrypoint-initdb.d目录(初始化的SQL脚本目录)
  • 挂载/root/mysql/conf到容器内的/etc/mysql/conf.d目录(这个是MySQL配置文件目录)
# mysql部署
# 创建一个文件起名mysql,进入到mysql的目录创建这四个文件
docker run -d \
  --name mysql \
  -p 3306:3306 \
  -e TZ=Asia/Shanghai \
  -e MYSQL_ROOT_PASSWORD=123456 \
  -v /root/data/www/mysql/data:/var/lib/mysql \
  -v /root/data/www/mysql/conf:/etc/mysql/conf.d \
  -v /root/data/www/mysql/init:/docker-entrypoint-initdb.d \
  -v /root/data/www/mysql/log:/var/log/mysql \
  --network heima \
  mysql
# 执行上一步前我们需要在我的windows电脑导出mysql的一个数据库。
C:\Users\Teen>mysqldump -u root -p --host=127.0.0.1 --port=3306 --databases blog_project > C:\Users\Teen\Desktop\blog_project.sql
# 导出的sql文件上传到刚刚的init文件中
# 如果你有conf文件也上传到conf文件
如何测试连接是否成功
用连接mysql的工具,如navicat,输入云服务器ip,端口号,数据库密码,连接后就可以看到你之前导出的数据库了

mysql conf配置文件

[client]
default_character_set=utf8mb4
[mysql]
default_character_set=utf8mb4
[mysqld]
bind-address=0.0.0.0
skip-host-cache
skip-name-resolve
performance_schema_max_table_instances=400
table_definition_cache=400
table_open_cache=256
performance_schema=off
character_set_server=utf8mb4
collation_server=utf8mb4_unicode_ci
init_connect='SET NAMES utf8mb4'

# Logging settings
general_log = 1
general_log_file = /var/log/mysql/mysql.log
log_error = /var/log/mysql/mysql_error.log
slow_query_log = 1
slow_query_log_file = /var/log/mysql/mysql-slow.log
log_bin = /var/log/mysql/mysql-bin.log


# Logging settings 
general_log = 1 
general_log_file = /var/log/mysql/mysql.log 
log_error = /var/log/mysql/mysql_error.log 
slow_query_log = 1 
slow_query_log_file = /var/log/mysql/mysql-slow.log 
log_bin = /var/log/mysql/mysql-bin.log

dockerFile学习,自定义镜像

因为面对复杂的语言与框架版本,我们可能找不到合适的,所以需要自己编写dockerfile文件自定义镜像。

dockerfile文件编写

# 先创建
cd /opt/
mkdir demo
cd demo 
vim Dockerfile

构建镜像,运行容器

# 开始构建镜像,-t 起名字a:1.0, . 为当前目录下的Dockerfile
docker build -t docker-demo:1.0 .
# 直接指定Dockerfile目录
docker build -t docker-demo:1.0 /root/demo
# 查看镜像列表: 
docker images
# 镜像构建好之后,运行
docker run -d --name Django -p 8080:8000 docker-demo
#
docker ps
docker logs -f Django

容器网络互联

前言:在安装docker时会自动创建一个网卡,创建的容器是可以互通的,创建一个自定义网络,加入的容器可以通过容器名互相访问

# 查看网卡
ip addr
# 查看所有网络
docker network ls
# 创建一个网络
docker network create heima
# 删除指定网络
docker network rm
# 使指定容器连接加入某网络
docker network connect heima mysql
docker network connect heima nginx
# 查看mysql,会看有两个网桥,一个是默认的,一个是heima
docker inspect mysql
# 删除容器docker-demo
# 在创建时,加入网桥,那就只有一个网桥
docker run -d --name Django -p 8080:8000 --network heima docker-demo
# 进入nginx容器,ping mysql看能否ping通 
docker exex -it nginx bash 
# 使指定容器连接离开某网络
docker network disconnect
# 查看网络详细信息
docker network inspect heima 
"Containers"中为加入该网络的容器

构建centos镜像里面安装python,Django,写Dockerfile

# 准备工作
docker pull centos:centos7
cd /opt/
mkdir demo1
cd demo1
vim Dockerfile

以下是Dockerfile文件

# 先构建一个基础的python环境镜像,在到这个基础的镜像部署其它的项目
# Base images 基础镜像
FROM centos:7
# 指定语言,防止中文日志乱码
ENV LANG en_US.UTF-8  
ENV LANGUAGE en_US:en  
ENV LC_ALL en_US.UTF-8
# 指定时区
ENV TZ=Asia/Shanghai

#MAINTAINER 维护者信息 名字邮箱
MAINTAINER youxiang@163.com

# GCC编译器
RUN yum install gcc -y

# Python依赖
RUN yum install -y zlib zlib-devel bzip2 bzip2-devel ncurses ncurses-devel readline readline-devel openssl openssl-devel  xz lzma xz-devel sqlite sqlite-devel gdbm gdbm-devel tk tk-devel  mysql-devel python-devel libffi-devel

# wget
RUN yum install wget -y

# 目录
RUN mkdir -p /data/
WORKDIR /data/

# Python3.9.8环境
WORKDIR /data/
RUN wget https://www.python.org/ftp/python/3.9.8/Python-3.9.8.tgz
RUN tar -xvf Python-3.9.8.tgz
WORKDIR /data/Python-3.9.8/
RUN ./configure
RUN make && make install
RUN pip3.9 config set global.index-url https://pypi.douban.com/simple/

# 安装git,以及设置自己的git名字和邮箱
RUN yum install git -y
构建镜像,为什么这样操作,如果我们某个设置出了问题,我们可以,删除掉镜像重来,但你在一个镜像修改,下载这些会耗费时间
docker build -t centos_py3.9.8 . -f Dockerfile --no-cache

在之前的基础构建新的

# Base images 基础镜像
FROM centos_py3.9.8:latest
# 指定语言,防止中文日志乱码
ENV LANG en_US.UTF-8  
ENV LANGUAGE en_US:en  
ENV LC_ALL en_US.UTF-8
# 指定时区
ENV TZ=Asia/Shanghai

#MAINTAINER 维护者信息
MAINTAINER youxiang@163.com

# Python3.9.8环境
WORKDIR /data/
RUN pip3 config set global.index-url https://pypi.mirrors.ustc.edu.cn/simple/
# 这是从私人仓库拉代码
# 将GitHub token 设置为环境变量
ARG GITHUB_TOKEN
ENV GITHUB_TOKEN=$GITHUB_TOKEN
# git拉代码
WORKDIR /data/
RUN git clone https://$GITHUB_TOKEN@github.com/username/Blog.git

# 虚拟环境
WORKDIR /data/Blog/
RUN pip3.9 install virtualenv
RUN virtualenv  /envs/blog --python=python3.9
RUN /envs/blog/bin/pip3.9 install -r requirements.txt

# 安装uwsgi
RUN /envs/blog/bin/pip3.9 install uwsgi

# 运行项目
WORKDIR /data/Blog
CMD ["/envs/blog/bin/uwsgi", "--buffer-size", "65535","--ini","nb_uwsgi.ini"]
# 构建,如果不是私人的删除掉--build-arg GITHUB_TOKEN=token
docker build --build-arg GITHUB_TOKEN=token -t django02 . -f Dockerfile1 --no-cache
# 运行这个容器,挂载一个本地uwsgi好修改文件
docker run -d --name djangoproject02 -v /root/django/nb_uwsgi.ini:/data/Blog/nb_uwsgi.ini --network heima django02
# 怎么判断它运行成功,进入项目容器,启动虚拟环境,命令行模式启动项目
docker exec -it djangoproject02 bash
source /envs/blog/bin/activate
cd /data/Blog
python manage.py runserver
# 成功运行后,测试与数据库的连接,这样可能会让mysql容器的数据混乱,重新配置文件,生成容器就好
准备文件,
# nginx的conf文件
worker_processes auto;
events {
	worker_connections  1024;
}

http {
	include       mime.types;
	default_type  application/octet-stream;
	sendfile        on;
	keepalive_timeout  65;
	server {
		listen       80;
		server_name  localhost;
		location / {
                    root   /usr/share/nginx/html/;  
                    index  index.html index.htm; 
                }
                error_page   500 502 503 504  /50x.html;
                location = /50x.html {
                    root   html;
                }
                # 下面的是vue项目向后端数据可能要经过如http://192.123.123.134:8001/api/,api等同于app01,记着vue项目访问后端的,采用以下设置就是相对路径了,这样的axios.defaults.baseURL = '/app01/',或者这样baseURL: '/app01/'。add_header cors设置其实可以去掉,你可以尝试一下
                location /app01 {
                    add_header 'Access-Control-Allow-Origin' '*';
                    add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
                    add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range';
                    add_header 'Access-Control-Allow-Credentials' 'true';
                    include uwsgi_params;
                    uwsgi_pass djangoproject02:8001;

                }
	}
}
########## uwsgi文件
uwsgi.ini文件
[uwsgi]
socket = djangoproject02:8001
chdir = /data/Blog/
wsgi-file = Blog_project/wsgi.py
master = true
uid=root
gid=root
pidfile=uwsgi.pid
enable-threads = true
processes = 2
threads = 4
vacuum = true
virtualenv = /envs/blog/

在调试中我们可能要删除容器,以下是运行命令

docker rm -f 容器名或容器ID # 删除正在运行的容器
docker exec -it 容器名或容器ID bash # 进入容器命令行
docker images # 查看镜像
docker rmi 容器名或容器ID # 删除镜像

# nginx
docker run -d \
  --name nginx \
  -p 80:80 \
  -v /root/nginx/html:/usr/share/nginx/html \
  -v /root/nginx/nginx.conf:/etc/nginx/nginx.conf \
  --network heima \
  nginx
# django01
docker run -d --name djangoproject \
--network heima \
django01
# mysql
docker run -d \
  --name mysql \
  -p 3306:3306 \
  -e TZ=Asia/Shanghai \
  -e MYSQL_ROOT_PASSWORD=123456 \
  -v /root/data/www/mysql/data:/var/lib/mysql \
  -v /root/data/www/mysql/conf:/etc/mysql/conf.d \
  -v /root/data/www/mysql/init:/docker-entrypoint-initdb.d \
  -v /root/data/www/mysql/log:/var/log/mysql \
  --network heima \
  mysql
-  mysql的一些叙述,导出sql文件
C:\Users\HMTeen>mysqldump -u root -p --host=127.0.0.1 --port=3306 --databases django_icwp_v3 > C:\Users\HMTeen\Desktop\icwp-mysql-data\mysqldump\icwp_full_data-1.sql
Enter password: ******
该操作将django_icwp_v3数据库的所有数据导出到sql文件中:包含建库命令-建表命令-数据插入命令…

-   将保存的数据,放到上述init文件夹下面,名字不重要,后缀是sql就行
参考:http://t.csdnimg.cn/IiJ7e
出错了怎么办
先进入django容器,让项目运行起来
python manage.py runserver,
测试与数据库的连接,这样可能会让mysql容器的数据混乱,重新配置文件,生成容器就好
python manage.py migrate,
后端问题解决了后
前端访问页面,打开浏览器控制台,排除错误,同时记得查看djano容器日志
# 查看日志
docker logs 容器名或容器ID
redis 待续,前面的跑通了redis就很快上手了,最近有些事情比较多
参考:https://b11et3un53m.feishu.cn/wiki/MWQIw4Zvhil0I5ktPHwcoqZdnec
结语:感谢heima,wupeiqi

问题:mysql容器总是挂,这样导致后端获取不了数据,整个网页没数据。

mysql解决方法一

这样会删掉了之前的容器以及挂载的数据卷data目录下的数据,之前的数据库消失了,这个方法不太好,这是目前的解决办法,后面我会尝试,按固定的时间去备份一个,然后检查数据库是否挂掉。
步骤 1:停止并删除当前的 MySQL 容器
docker stop mysql
docker rm mysql
步骤 2:删除本地数据目录中的文件
rm -rf /root/data/www/mysql/data/*
步骤 3:重新创建并启动 MySQL 容器
docker run -d \
  --name mysql \
  -p 3306:3306 \
  -e TZ=Asia/Shanghai \
  -e MYSQL_ROOT_PASSWORD=123456 \
  -v /root/data/www/mysql/data:/var/lib/mysql \
  -v /root/data/www/mysql/conf:/etc/mysql/conf.d \
  -v /root/data/www/mysql/init:/docker-entrypoint-initdb.d \
  -v /root/data/www/mysql/log:/var/log/mysql \
  --network heima \
  mysql
步骤 4:检查 MySQL 容器日志 为前台日志,一般看不出什么
重新启动容器后,检查 MySQL 容器的日志以确认是否成功启动:
docker logs -f mysql

# 真正的步骤
进入MySQL容器
docker exec -it mysql bash
进入MySQL日志的地方,查看日志
cat /var/log/mysql/mysql_error.log 
或查看MySQL数据库是否有自己的数据库
docker exec -it mysql mysql -u root -p123456
SHOW DATABASES;
USE database_name;
SHOW TABLES;

解决方法二

写一个自动化备份脚本,再写一个自动化检查容器是否挂掉,挂掉重启