作者:KerryWu来源:SegmentFault 思否社区
前言
这是一次完整的项目实践,Angular页面+Springboot接口+MySQL都通过Dockerfile打包成docker镜像,通过docker-compose做统一编排。目的是实现整个项目产品的轻量级和灵活性,在将各个模块的镜像都上传公共镜像仓库后,任何人都可以通过 “docker-compose up -d” 一行命令,将整个项目的前端、后端、数据库以及文件服务器等,运行在自己的服务器上。
本项目是开发一个类似于segmentfault的文章共享社区,我的设想是当部署在个人服务器上时就是个人的文章库,部署在项目组的服务器上就是项目内部的文章库,部署在公司的服务器上就是所有职工的文章共享社区。突出的特点就是,项目相关的所有应用和文件资源都是灵活的,用户可以傻瓜式地部署并使用,对宿主机没有任何依赖。
目前一共有三个docker镜像,考虑以后打在一个镜像中,但目前只能通过docker-compose来编排这三个镜像。
- MySQL镜像:以MySQL为基础,将项目所用到的数据库、表结构以及一些基础表的数据库,通过SQL脚本打包在镜像中。用户在启动镜像后就自动创建了项目所有的数据库、表和基础表数据。
- SpringBoot镜像:后台接口通过SpringBoot开发,开发完成后直接可以打成镜像,由于其内置tomcat,可以直接运行,数据库指向启动好的MySQL容器中的数据库。
- Nginx(Angular)镜像:Nginx镜像中打包了Angular项目的dist目录资源,以及default.conf文件。主要的作用有:部署Angular项目页面;挂载宿主机目录作为文件服务器;以及反向代理SpringBoot接口,解决跨域问题等等。
最后三个docker容器的编排通过docker-compose来实现,三个容器之间的相互访问都通过容器内部的别名,避免了宿主机迁移时ip无法对应的问题。为了方便开发,顺便配了个自动部署。
MySQL镜像
初始化脚本
在项目完成后,需要生成项目所需数据库、表结构以及基础表数据的脚本,保证在运行该docker容器中,启动MySQL数据库时,自动构建数据库和表结构,并初始化基础表数据。
Navicat for MySQL的客户端支持导出数据库的表结构和表数据的SQL脚本。如果没有安装Navicat,可以在连接上容器中开发用的MySQL数据库,通过mysqldump 命令导出数据库表结构和数据的SQL脚本。下文中就是将数据库的SQL脚本导出到宿主机的/bees/sql 目录:
docker exec -it mysql mysqldump -uroot -pPASSWORD 数据库名称 > /bees/sql/数据库名称.sql
以上只是导出 表结构和表数据的脚本,还要在SQL脚本最上方加上 生成数据库的SQL:
drop database if exists 数据库名称;
create database 数据库名称;
use 数据库名称;
通过以上两个步骤,数据库、表结构和表数据三者的初始化SQL脚本就生成好了。
Dockerfile构建镜像
我们生成的SQL脚本叫 bees.sql,在MySQL官方镜像中提供了容器启动时自动执行/docker-entrypoint-initdb.d文件夹下的脚本的功能(包括shell脚本和sql脚本),我们在后续生成镜像的时候,将上述生成的SQL脚本COPY到MySQL的/docker-entrypoint-initdb.d目录下就可以了。
现在我们写Dockerfile,很简单:
FROM mysql
MAINTAINER kerry(kerry.wu@definesys.com)
COPY bees.sql /docker-entrypoint-initdb.d
将 bees.sql 和 Dockerfile 两个文件放在同一目录,执行构建镜像的命令就可以了:
docker build -t bees-mysql .
现在通过 docker images,就能看到本地的镜像库中就已经新建了一个 bees-mysql的镜像啦。
SpringBoot镜像
springboot构建镜像的方式很多,有通过代码生成镜像的,也有通过jar包生成镜像的。我不想对代码有任何污染,就选择后者,通过生成的jar包构建镜像。
创建一个目录,上传已经准备好的springboot的jar包,这里名为bees-0.0.1-SNAPSHOT.jar,然后同样编写Dockerfile文件:
FROM java:8
VOLUME /tmp
ADD bees-0.0.1-SNAPSHOT.jar /bees-springboot.jar
EXPOSE 8010
ENTRYPOINT ["java","-Djava.security.egd=file:/dev/./urandom","-jar","-Denv=DEV","/bees-springboot.jar"]
将bees-0.0.1-SNAPSHOT.jar和Dockerfile放在同一目录执行命令开始构建镜像,同样在本地镜像库中就生成了bees-springboot的镜像:
docker build -t bees-springboot .
Nginx(Angular)镜像
Nginx的配置
该镜像主要在于nginx上conf.d/default.conf文件的配置,主要实现三个需求:
1、Angualr部署
Angular的部署很简单,只要将Angular项目通过 ng build --prod 命令生成dist目录,将dist目录作为静态资源文件放在服务器上访问就行。我们这里就把dist目录打包在nginx容器中,在default.conf上配置访问。
2、文件服务器
项目为文章共享社区,少不了的就是一个存储文章的文件服务器,包括存储一些图片之类的静态资源。需要在容器中创建一个文件目录,通过default.conf上的配置将该目录代理出来,可以直接访问目录中的文件。
当然为了不丢失,这些文件最好是保存在宿主机上,在启动容器时可以将宿主机本地的目录挂载到容器中的文件目录。
3、接口跨域问题
在前后端分离开发的项目中,“跨域问题”是较为常见的,SpringBoot的容器和Angular所在的容器不在同一个ip和端口,我们同样可以在default.conf上配置反向代理,将后台接口代理成同一个ip和端口的地址。
话不多说,结合上面三个问题,我们最终的default.conf为:
server {
listen 80;
server_name localhost;
gzip on;
gzip_min_length 1k;
gzip_buffers 4 16k;
gzip_comp_level 3;
gzip_types text/plain application/x-javascript application/javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png;
gzip_vary on;
location / {
root /usr/share/nginx/html;
index index.html index.htm;
try_files $uri $uri/ /index.html;
}
location /api/ {
proxy_pass http://beesSpringboot:8010/;
}
location /file {
alias /home/file;
index index.html index.htm;
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root /usr/share/nginx/html;
}
}
- location / :代理的是Angular项目,dist目录内通过Dockerfile
COPY在容器内的/usr/share/nginx/html目录; - location /file :代理/home/file 目录,作为文件服务器;
- location /api/ :是为了解决跨域而做的反向代理,为了脱离宿主机的限制,接口所在容器的ip通过别名beesSpringboot来代替。别名的设置是在docker-compose.yml中设置的,后续再讲。
- 添加了gzip,针对前端较大资源文件下载速度的优化
Dockerfile构建镜像
同样创建一个目录,包含Angualr的dist目录、Dockerfile和nginx的default.conf文件,目录结构如下:
[root@Kerry angular]# tree
.
├── dist
│ └── Bees
│ ├── 0.cb202cb30edaa3c93602.js
│ ├── 1.3ac3c111a5945a7fdac6.js
│ ├── 2.99bfc194c4daea8390b3.js
│ ├── 3.50547336e0234937eb51.js
│ ├── 3rdpartylicenses.txt
│ ├── 4.53141e3db614f9aa6fe0.js
│ ├── assets
│ │ └── images
│ │ ├── login_background.jpg
│ │ └── logo.png
│ ├── favicon.ico
│ ├── index.html
│ ├── login_background.7eaf4f9ce82855adb045.jpg
│ ├── main.894e80999bf907c5627b.js
│ ├── polyfills.6960d5ea49e64403a1af.js
│ ├── runtime.37fed2633286b6e47576.js
│ └── styles.9e4729a9c6b60618a6c6.css
├── Dockerfile
└── nginx
└── default.conf
Dockerfile文件如下:
FROM nginx
COPY nginx/default.conf /etc/nginx/conf.d/
RUN rm -rf /usr/share/nginx/html/*
COPY /dist/Bees /usr/share/nginx/html
CMD ["nginx", "-g", "daemon off;"]
以上,通过下列命令,构建bees-nginx-angular的镜像完成:
`docker build -t bees-nginx-angular .
docker-compose容器服务编排
上述,我们已经构建了三个镜像,相对应的至少要启动三个容器来完成项目的运行。那要执行三个docker run?太麻烦了,而且这三个容器之间还需要相互通信,如果只使用docker来做的话,不光启动容器的命令会很长,而且为了容器之间的通信,docker --link 都会十分复杂,这里我们需要一个服务编排。docker的编排名气最大的当然是kubernetes,但我的初衷是让这个项目轻量级,不太希望用户安装偏重量级的kubernetes才能运行,而我暂时又没能解决将三个镜像构建成一个镜像的技术问题,就选择了适中的一个产品--docker-compse。
安装docker-compose很简单,这里就不赘言了。安装完之后,随便找个目录,写一个docker-compose.yml文件,然后在该文件所在地方执行一行命令就能将三个容器启动了:
#启动
docker-compose up -d
#关闭
docker-compose down
这里直接上我写的docker-compose.yml文件
version: "2"
services:
beesMysql:
restart: always
image: bees-mysql
ports:
- 3306:3306
volumes:
- /bees/docker_volume/mysql/conf:/etc/mysql/conf.d
- /bees/docker_volume/mysql/logs:/logs
- /bees/docker_volume/mysql/data:/var/lib/mysql
environment:
MYSQL_ROOT_PASSWORD: kerry
beesSpringboot:
restart: always
image: bees-springboot
ports:
- 8010:8010
depends_on:
- beesMysql
beesNginxAngular:
restart: always
image: bees-nginx-angular
ports:
- 8000:80
depends_on:
- beesSpringboot
volumes:
- /bees/docker_volume/nginx/nginx.conf:/etc/nginx/nginx.conf
- /bees/docker_volume/nginx/conf.d:/etc/nginx/conf.d
- /bees/docker_volume/nginx/file:/home/file
image:镜像名称
ports:容器的端口和宿主机的端口的映射
services:文中三个service,在各自容器启动后就会自动生成别名,例如:在springboot中访问数据库,只需要通过“beesMysql:3306”就能访问。
depends_on:会设置被依赖的容器启动之后,才会启动自己。例如:mysql数据库容器启动后,再启动springboot接口的容器。
volumes:挂载卷,一些需要长久保存的文件,可通过宿主机中的目录,挂载到容器中,否则容器重启后会丢失。例如:数据库的数据文件;nginx的配置文件和文件服务器目录。
其他
自动部署
为了提高开发效率,简单写了一个自动部署的脚本,直接贴脚本了:
#!/bin/bash
v_springboot_jar=`find /bees/devops/upload/ -name "*.jar"`
echo "找到jar:"$v_springboot_jar
v_angular_zip=`find /bees/devops/upload/ -name "dist.zip"`
echo "找到dist:"$v_angular_zip
cd /bees/conf/
docker-compose down
echo "关闭容器"
docker rmi -f $(docker images | grep "bees-springboot" | awk '{print $1}')
docker rmi -f $(docker images | grep "bees-nginx-angular" | awk '{print $1}')
echo "删除镜像"
cd /bees/devops/dockerfiles/springboot/
rm -f *.jar
cp $v_springboot_jar ./bees-0.0.1-SNAPSHOT.jar
docker build -t bees-springboot .
echo "生成springboot镜像"
cd /bees/devops/dockerfiles/angular/
rm -rf dist/
cp $v_angular_zip ./dist.zip
unzip dist.zip
rm -f dist.zip
docker build -t bees-nginx-angular .
echo "生成angular镜像"
cd /bees/conf/
docker-compose up -d
echo "启动容器"
docker ps |grep bees
遇到的坑
一开始在docker-compose.yml文件中写services时,每个service不是驼峰式命名,而是下划线连接,例如:bees_springboot、bees_mysql、bees_nginx_angular 。
在springboot中访问数据库的别名可以,但是在nginx中,反向代理springboot接口地址时死活代理不了 bees_springboot的别名。能在bees_nginx_angular的容器中ping通bees_springboot,但是代理不了bees_springboot地址的接口,通过curl -v 查看原因,是丢失了host。
最后发现,nginx默认request的header中包含“_”下划线时,会自动忽略掉。我因此把docker-compose.yml中service名称,从下划线命名都改成了驼峰式。
当然也可以通过在nginx里的nginx.conf配置文件中的http部分中添加如下配置解决:
underscores_in_headers on;
- END -