Javaweb前后端分离项目docker部署

Javaweb前后端分离项目docker中部署

目录

• Javaweb前后端分离项目docker中部署
  • 一、环境
  • 二、准备
    • (一)、Javaweb项目打包
      • 1、利用maven打包成war/jar文件
    • (二)、镜像制作
    • (三)、前端文件打包
    • (四)、nginx配置
  • 三、部署
    • 1、前端部署——在nginx中
      • 1）拉取nginx镜像
      • 2）启动nginx容器
      • 3）配置nginx
        • 使用nginx默认配置
        • 自定义配置
    • 2、数据库部署
    • 3、后端部署
      • 1）启动已构建的后端镜像
      • 2）修改nginx配置

一、环境

• docker
• nginx
• react
• spring

二、准备

(一)、Javaweb项目打包

1、利用maven打包成war/jar文件

• 跳过测试文件

  打包前先修改maven打包配置，不打包测试文件

  // 在下图中输入
  -Dmaven.test.skip=true -Dpmd.skip=true
  

  

• 打包成war/jar包，相关在pom.xml中配置

  在Maven中选中 项目名 下的package进行打包

  

• 无异常后获取结果

  打包好后的包在 项目/target下

(二)、镜像制作

将Dockerfile、start.sh、xxxx.war等相关文件放在同一个目录下

docker build -t image_name:tag .     # 创建镜像

# Dockerfile参考

FROM oracle-jdk:8

ENV TZ=Asia/Shanghai

RUN ln -snf /usr/share/zoneinfo/$TZ /etc/localtime && echo $TZ > /etc/timezone 
    && mkdir -p /home/admin/

ENV APP_DIR=/home/admin/

WORKDIR $APP_DIR

COPY libdxlc_ctu.so startup.sh darklight-console.war ip2region.db $APP_DIR

ENTRYPOINT ["/home/admin/startup.sh"]

# start.sh参考

#!/bin/sh

if test -z "$JVM_OPTION_SETTING"; then
    JVM_OPTION_SETTING="-Xms512M -Xmx512M -Xss256k"
fi

JAVA_OPTS="-server $JVM_OPTION_SETTING -Dfile.encoding=UTF-8 -XX:+UseParNewGC -XX:+UseConcMarkSweepGC -XX:+PrintGCDetails -XX:+PrintGCDateStamps -XX:+HeapDumpOnOutOfMemoryError -Xnoclassgc $*"

java $JAVA_OPTS -jar darklight-console.war --spring.profiles.active=prod

(三)、前端文件打包

npm build

打包后的文件具体位置根据配置文件确定，这里打包好的文件即 build 目录

(四)、nginx配置

1、修改配置方式

• 直接修改/etc/ngxin/nginx.conf

• 或者新建my.conf在/etc/nginx/conf.d/目录下

2、nginx默认配置

nginx在/etc/nginx/conf.d/目录下有个default.conf默认配置，其中指定了前端文件默认存储目录

• root => 指定静态文件默认存储的位置
• index index.html index.htm; => 配置默认首页，即root对应目录下的index.html或者index.htm

3、修改配置

这里通过新建conf文件修改配置:

• proxy_pass：后端的ip:port
• root、index：指定静态文件存放的根目录、启动的首页页面

server {

	listen 80;
	server_name 172.30.5.10;
	charset utf-8;

	client_max_body_size 800m;

	location / {
		# root /xxx/xxx   # 可指定前端文件的根目录
		# index index.html   # 启动首页
		proxy_set_header Host $host;
	    proxy_set_header X-Real-IP $remote_addr;
	    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
	    proxy_pass http://172.30.5.10:8099/;
    }
}

三、部署

1、前端部署——在nginx中

1）拉取nginx镜像

docker pull nginx

2）启动nginx容器

docker run -d --restart=always 
    --name nginx-1 
    --network darklight 
    --ip 172.30.5.12 
    -p 9001:80 
    -v $PWD/nginx-info/conf.d/my.conf:/etc/nginx/conf.d/my.conf       # 在自定义配置文件使用
    -v $PWD/nginx-info/html:/usr/share/nginx/html 
    -v $PWD/nginx-info/logs:/var/log/nginx 
    nginx:latest

3）配置nginx

修改前端打包文件中window.API_SERVER = 'http://172.30.5.10:8080'，其他项目忽略此句

• 使用nginx默认配置

  • 需要将打包后目录下的所有文件替换到默认配置文件指定的目录这下(root所指定 /usr/share/nginx/html/)
  • 需要确保index对应的首页与目录下对应

• 自定义配置

  • 在配置文件中指定root和index

    server {
    
    	listen 80;
    	server_name 172.30.5.10;
    	charset utf-8;
    
    	client_max_body_size 800m;
    
    	location / {
    		root /xxx/xxx   # 可指定静态文件的根目录
    		index index.html   # 启动首页，需要与目录下首页对应
    		proxy_pass http://172.30.5.10:8099/;
        }
    }
    
    

• 此时通过ip:8080即可访问静态文件

2、数据库部署

docker pull mysql:5.7

docker run -d --restart=always 
    --name mysql-1 
    --network darklight 
    --ip 172.30.5.90 
    -p 3308:3306 
    -e MYSQL_ROOT_PASSWORD='xxxxxxxx' 
    -e MYSQL_DATABASE='mydatabase' 
    -v $PWD/mysql-datadir:/var/lib/mysql 
    mysql:5.7

3、后端部署

1）启动已构建的后端镜像

docker run -d --restart=always 
    --name ics-darklight 
    --network darklight 
    --ip 172.30.5.10 
    -p 8080:8099 
    -v $PWD/config:/home/admin/config 
    -v $PWD/darklight-console.war:/home/admin/darklight-console.war 
    -v $PWD/logs:/home/admin/logs 
    ics-darkligth:1.0

2）修改nginx配置

my.conf，通过挂载的方式将该文件挂载到容器/etc/nginx/conf.d/my.conf

server {

	listen 80;
	server_name 172.30.5.10;
	charset utf-8;

	client_max_body_size 800m;

	location / {
		root /xxx/xxx   # 可指定静态文件的根目录
		index index.html   # 启动首页，需要与目录下首页对应
		proxy_pass http://172.30.5.10:8099/;     # 指定nginx转发的目标地址
    }
}