Docker 前后端部署流程

Docker 前后端部署流程

1 Docker基本知识

2 后端部署

使用tomcat容器部署后端

# 创建数据卷,映射出tomcat容器的webapps目录和logs目录
mkdir -p /usr/local/dockertest/tomcat/webapps /usr/local/dockertest/tomcat/logs

设置tomcat容器日志方式

tomcat默认logs下没有catalina.out

只有使用startup.sh启动才会输出catalina.out。

但是Docker如果以startup.sh启动，启动后可能会立即退出，这时Docker需要一个后台执行程序才会保持容器不退出。

cd /usr/local/dockertest/tomcat
vim run.sh

run.sh 注意粘贴第一行会缺少内容

#第一行内容不能少
#!/bin/bash
bash /usr/local/tomcat/bin/startup.sh
tail -f /usr/local/tomcat/logs/catalina.out

构建自定义镜像,创建 tomcat dockerfile

cd /usr/local/dockertest/tomcat
vim tomcat_dockerfile

tomcat_dockerfile 注意粘贴第一行会缺少内容

#dockerfile文件内容：
FROM tomcat:8
#指定容器中工作目录
WORKDIR /app
#将主机当前目录下的tomcat日志run.sh启动脚本 添加到容器中
ADD run.sh /usr/local/tomcat
#添加脚本执行权限
RUN chmod +x /usr/local/tomcat/run.sh
#开放容器中端口
EXPOSE 8080
#指定容器运行命令 设置tomcat启动方式
CMD ["/usr/local/tomcat/run.sh"]

启动容器

#构建自定义镜像(记得在/usr/local/dockertest/tomcat目录下运行) 
# -t:指定镜像名和标签 -f:指定dockerfile文件  . :表示在当前目录下查找对应的dockerfile来构建镜像
docker build -t tomcat8:01 -f tomcat_dockerfile . 
#运行自定义的容器
docker run -d -p 8089:8080 -v /usr/local/dockertest/tomcat/webapps:/usr/local/tomcat/webapps -v /usr/local/dockertest/tomcat/logs:/usr/local/tomcat/logs --restart always --name tomcat_test tomcat8:01

部署war

#打印日志
cd /usr/local/dockertest/tomcat/logs
tail -f catalina.out -n -1000

#部署war
cd /usr/local/dockertest/tomcat/webapps
#拖动war

#记得访问路径，需要加上war包的名称, 例如 ip:端口/prof/xxx
http://8.137.103.17:8089/prof/hello

3 前端部署

使用nginx容器部署前端

# 创建nginx 文件夹 
mkdir -p /usr/local/dockertest/nginx/app /usr/local/dockertest/nginx/conf 

构建自定义镜像,创建 nginx dockerfile

cd /usr/local/dockertest/nginx
vim nginx_dockerfile

nginx_dockerfile 注意粘贴第一行会缺少内容

FROM nginx:1.21.5
# 工作目录，后面把vue文件放这里面
WORKDIR /app
EXPOSE 80
CMD ["nginx","-g","daemon off;"] #nginx在前台开启一个进程，可以访问

构建自定义nginx镜像

docker build -t nginx:01 -f nginx_dockerfile . 

自定义nginx.conf

cd /usr/local/dockertest/nginx/conf 
vim nginx.conf 

nginx.conf 注意粘贴第一行会缺少内容,最后一行会少了 }

user nginx;
worker_processes auto;

error_log /var/log/nginx/error.log notice;
pid /var/run/nginx.pid;

events {
    worker_connections 1024;
}

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

    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;

    keepalive_timeout  65;

    #gzip  on;


    server {
        listen       80;
        server_name  localhost;
        
		#前端文件路径
        location / {
            root /app/dist;
            index index.html;
            autoindex on;
        }
    }

    include /etc/nginx/conf.d/*.conf;
}

启动容器

docker run -d -p 91:80 -v /usr/local/dockertest/nginx/app:/app -v /usr/local/dockertest/nginx/conf/nginx.conf:/etc/nginx/nginx.conf --name nginx_test --restart always nginx:01 

部署vue项目dist

cd /usr/local/dockertest/nginx/app
# 扔包dist

浏览器访问

http://8.137.103.17:91/

#查看镜像
docker images
#删除镜像
docker rmi -f 镜像id