当前位置: 首页 > 工具软件 > vue-mb-touch > 使用案例 >

MAC将SpringBoot项目和Vue项目部署到Docker上

段干祺
2023-12-01

一、SpringBoot项目

1、在pom.xml的properties中添加Docker镜像名称

<properties>
        <docker.image.prefix>springboot</docker.image.prefix>
        <docker.image.suffix>weather</docker.image.suffix>
    </properties>

注:springboot可按需更改,这里仅做例子使用

2、在pom.xml的plugins添加构建Docker插件

<build>
        <finalName>weather-api</finalName>
        <plugins>
            <plugin>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-maven-plugin</artifactId>
            </plugin>
            <!-- Docker maven plugin -->
            <plugin>
                <groupId>com.spotify</groupId>
                <artifactId>docker-maven-plugin</artifactId>
                <version>0.4.13</version>
                <configuration>
                    <imageName>${docker.image.prefix}/${docker.image.suffix}</imageName>
                    <dockerDirectory>src/main/docker</dockerDirectory>
                    <resources>
                        <resource>
                            <targetPath>/</targetPath>
                            <directory>${project.build.directory}</directory>
                            <include>${project.build.finalName}.jar</include>
                        </resource>
                    </resources>
                </configuration>
            </plugin>
        </plugins>
    </build>

3、在src/main/docker目录下创建Dockerfile文件

FROM adoptopenjdk/openjdk8:alpine-jre
MAINTAINER author
EXPOSE 8081
VOLUME /tmp
ADD weather-api.jar app.jar
RUN sh -c 'touch /app.jar'
ENV JAVA_OPTS=""
ENTRYPOINT [ "sh", "-c", "java $JAVA_OPTS -Djava.security.egd=file:/dev/./urandom -jar /app.jar" ]
  • FROM 表示要构建的镜像基于哪个镜像,java:8表示使用jdk8环境为基础镜像
  • MAINTAINET 指定维护者的信息
  • EXPOSE 告诉Docker这个容器在运行时会监听哪些端口
  • VOLUME 指向了一个/tmp的目录,由于 Spring Boot 使用内置的Tomcat容器,Tomcat 默认使用/tmp作为工作目录。这个命令的效果是:在宿主机的/var/lib/docker目录下创建一个临时文件并把它链接到容器中的/tmp目录
    ADD 表示把文件拷入docker ,并改名成 app.jar
  • ADD 复制指定的到容器的中,可以是 Dockerfile 所在的目录的一个相对路径;可以是 URL,也可以是 tar.gz(自动解压)
  • RUN 每条指令将在当前镜像基础上执行,并提交为新的镜像。(可以用 “\” 换行)
  • ENV 指定环境变量,会被 RUN 指令使用,并在容器运行时保存
  • ENTRYPOINT 表示使用指定命令在镜像运行时执行,启动jar,配置容器启动后执行的命令,并且不可被 docker run 提供的参数覆盖。(每个 Dockerfile 中只能有一个 ENTRYPOINT ,当指定多个时,只有最后一个起效)

4、使用Dockerfileg构建镜像,进入项目目录执行如下命令:

mvn package docker:build

第一次会启动慢一些,如果看到如下信息说明构建镜像成功:

Step 1/8 : FROM adoptopenjdk/openjdk8:alpine-jre

 ---> 11786ee7c1c9
Step 2/8 : MAINTAINER dinglong

 ---> Running in d4fdbe133c40
Removing intermediate container d4fdbe133c40
 ---> 5a374268e8e0
Step 3/8 : EXPOSE 8081

 ---> Running in 5f859c6259ec
Removing intermediate container 5f859c6259ec
 ---> a7436e452b6e
Step 4/8 : VOLUME /tmp

 ---> Running in d4f7fc3757a4
Removing intermediate container d4f7fc3757a4
 ---> 15ab8031b461
Step 5/8 : ADD weather-api.jar app.jar

 ---> 4823f70b8604
Step 6/8 : RUN sh -c 'touch /app.jar'

 ---> Running in 3a0b0c05984c
Removing intermediate container 3a0b0c05984c
 ---> 93eecba147bb
Step 7/8 : ENV JAVA_OPTS=""

 ---> Running in 046590ea8b01
Removing intermediate container 046590ea8b01
 ---> 2e63d89f45ed
Step 8/8 : ENTRYPOINT [ "sh", "-c", "java $JAVA_OPTS -Djava.security.egd=file:/dev/./urandom -jar /app.jar" ]

 ---> Running in fa76d6bcc705
Removing intermediate container fa76d6bcc705
 ---> 1cf44c745ee7
ProgressMessage{id=null, status=null, stream=null, error=null, progress=null, progressDetail=null}
Successfully built 1cf44c745ee7
Successfully tagged springboot/weather:latest
[INFO] Built springboot/weather
[INFO] ------------------------------------------------------------------------
[INFO] BUILD SUCCESS
[INFO] ------------------------------------------------------------------------
[INFO] Total time:  11.720 s
[INFO] Finished at: 2022-02-26T12:35:09+08:00
[INFO] ------------------------------------------------------------------------

5、使用 docker images 命令查看构建好镜像

author@authordeMacBook-Pro ~ % docker images
REPOSITORY              TAG          IMAGE ID       CREATED          SIZE
springboot/weather      latest       1cf44c745ee7   33 seconds ago   192MB

6、springboot/weather是我们构建的镜像,运行镜像命令:

docker run -p 8081:8081 -t springboot/weather:latest
  • –name,指定容器名称
  • -v,映射卷(将宿主机的/tmp路径映射到容器内的/tmp路径,rw表示读写,ro表示只读)
  • -p,指定映射的端口
  • -i,交互式
  • -t,分配伪终端
  • -d,后台运行

7、使用docker ps 查看正在运行的镜像:

author@authordeMacBook-Pro ~ % docker ps -a
CONTAINER ID   IMAGE                       COMMAND                  CREATED          STATUS          PORTS                    NAMES
c5e9681eafcf   springboot/weather:latest   "sh -c 'java $JAVA_O…"   21 seconds ago   Up 19 seconds   0.0.0.0:8081->8081/tcp   vigorous_feistel

二、Vue项目

1、打包成dist目录

npm run build

2、在dist同目录下创建Dockerfile文件

#dockerfile
#使用 nginx:stable作为基础镜像
FROM nginx:stable

#将当前文件夹的dist文件复制到容器的/usr/share/nginx/html目录
COPY ./dist /usr/share/nginx/html/

#声明运行时容器暴露的端口(容器提供的服务端口)
EXPOSE 3001

#CMD:指定容器启动时要运行的命令
CMD ["nginx", "-g", "daemon off;"]
注:docker中安装nginx:stable,命令:docker pull nginx:stable

3、打包镜像

docker build -t weather-ui:1.0 .
注:创建镜像的仓库是weather-ui, 标签是1.0

4、查看镜像

author@authordeMacBook-Pro ~ % docker images
REPOSITORY              TAG          IMAGE ID       CREATED         SIZE
weather-ui              1.0          1f77fa27d336   4 minutes ago   149MB
springboot/weather      latest       1cf44c745ee7   7 minutes ago   192MB

5、运行容器

docker run -P -d weather-ui:1.0

6、查看容器

author@authordeMacBook-Pro ~ % docker ps -a
CONTAINER ID   IMAGE                       COMMAND                  CREATED              STATUS              PORTS                                            NAMES
d85f08d9c28f   weather-ui:1.0              "/docker-entrypoint.…"   6 seconds ago        Up 5 seconds        0.0.0.0:55001->80/tcp, 0.0.0.0:55000->3001/tcp   naughty_moore
c5e9681eafcf   springboot/weather:latest   "sh -c 'java $JAVA_O…"   About a minute ago   Up About a minute   0.0.0.0:8081->8081/tcp                           vigorous_feistel

7、复制容器暴露出来的端口55001

CONTAINER ID   IMAGE                       COMMAND                  CREATED              STATUS              PORTS                                            NAMES
d85f08d9c28f   weather-ui:1.0              "/docker-entrypoint.…"   6 seconds ago        Up 5 seconds        0.0.0.0:55001->80/tcp, 0.0.0.0:55000->3001/tcp   naughty_moore

三、总结

因为这是一个前后端分离的项目,所以两个容器启动以后,在浏览器访问http://localhost:55001即可访问项目内容

注:55001是前端容器暴露的端口

 类似资料: