前后端项目上云☁部署
|
文章
|
265

2931 字
|
14 分钟
本文最后更新于87 天前，其中的信息可能已经过时，如有错误请发送邮件到3095478042@qq.com
友情链接：前后端项目上云☁部署 – DENG

此笔记是根据上述链接结合自身所编写

JAVA(SpringBoot/Maven/tomcat)+Node.js(nvm/Vue/React/AngularJS)+Nginx中间件等前后端项目上云☁部署 所需的Docker容器基础镜像，清单如下：
1、JDK11基础镜像；
2、NVM基础镜像；
3、Nginx基础镜像。

一、环境准备

一、Docker 与 Jenkins 基础操作

  1. docker info
    • 查看 Docker 系统信息，包括镜像仓库地址、存储驱动、容器 / 镜像数量等，用于确认 Docker 服务是否正常运行。
  2. docker --version
    • 查看当前 Docker 版本，验证 Docker 是否安装成功。
  3. docker images
    • 列出本地所有 Docker 镜像，显示镜像名称、标签、ID、创建时间和大小。
  4. docker images -aq
    • -a 显示所有镜像（包括中间层镜像），-q 只显示镜像 ID，用于批量操作镜像（如删除所有镜像）。
  5. docker ps -a
    • 列出所有容器（包括运行中、已停止的），显示容器 ID、镜像、命令、状态等信息。
  6. docker ps -aq
    • 只显示所有容器的 ID，用于批量操作容器（如删除所有容器）。
  7. docker search jenkins
    • 在 Docker Hub 上搜索包含 “jenkins” 关键词的镜像，用于查找可用的 Jenkins 镜像。
  8. docker pull jenkins:latest
    • 拉取标签为 latest 的 Jenkins 镜像（旧版官方镜像，已逐步废弃）。
  9. docker pull jenkins/jenkins:lts
    • 拉取官方推荐的 Jenkins 长期支持版（LTS）镜像（jenkins/jenkins 是新版官方镜像仓库）。

二、Jenkins 容器启动（核心配置）

  •  Docker 镜像仓库拉取 Jenkins 的长期支持（LTS）版本镜像

docker pull jenkins/jenkins:lts

jenkins/jenkins：这是 Jenkins 官方在 Docker Hub 上的镜像仓库名称，前一个 jenkins 是用户名，后一个 jenkins 是仓库名

  • 启动 Jenkins 容器
docker run --name jenkins -u root -d -p 8080:8080 -p 50000:50000 -v /root/docker/volumes/var/jenkins_home:/var/jenkins_home -v /var/run/docker.sock:/var/run/docker.sock jenkins/jenkins:lts
jekins占用8080端口，可以将8080改成其他端口，我改成8083:8080端口了

-p 8080:8080 端口映射：将宿主机的 8080 端口映射到容器内的 8080 端口。

-p 50000:50000 Jenkins的Agent通信端口

  • 进入 Jenkins 容器交互终端的方式（bash 或 sh shell）用于在容器内执行命令（如配置工具）
docker exec -it jenkins /bin/bash
docker exec -it jenkins bash
  • 退出容器 exit

三、配置 Maven 环境（Java 项目构建工具）

创建maven的安装目录（在jenkins的工具目录下）

apache-maven-3.8.1下载
mkdir -p /root/docker/volumes/var/jenkins_home/tools/hudson.tasks.Maven_MavenInstallation/apache-maven-3.8.1
  • 进入目录
cd /root/docker/volumes/var/jenkins_home/tools/hudson.tasks.Maven_MavenInstallation/apache-maven-3.8.1
  • 没有unzip工具需下载：yum install -y unzip
  • 解压maven的压缩包（提前把安装包下载到该目录）

unzip apache-maven-3.8.1.zip

  • 进入解压后的maven目录
cd /root/docker/volumes/var/jenkins_home/tools/hudson.tasks.Maven_MavenInstallation/apache-maven-3.8.1
  • 将解压后的 Maven 子目录内容移动到当前目录（扁平化结构，避免路径嵌套）

mv ./apache-maven-3.8.1/* .

  • 谨慎命令（删除移动后空的maven目录） rm -rf ./apache-maven-3.8.1
  • 配置 Maven 环境变量，指定 Maven 安装路径（供 Jenkins 调用）
export MAVEN_HOME=/root/docker/volumes/var/jenkins_home/tools/hudson.tasks.Maven_MavenInstallation/apache-maven-3.8.1

四、配置 Java 环境（JDK）

  • 创建JDK 11 的安装目录（Jenkins 工具目录中 ）
mkdir -p /root/docker/volumes/var/jenkins_home/tools/hudson.tasks.JAVA_JDKInstallation/jdk-11_linux-x64_bin
  • 进入目录
cd /root/docker/volumes/var/jenkins_home/tools/hudson.tasks.JAVA_JDKInstallation/jdk-11_linux-x64_bin
  • 下载jdk11的压缩包（清华大学镜像站下载）
wget https://mirrors.tuna.tsinghua.edu.cn/Adoptium/11/jdk/x64/linux/OpenJDK11U-jdk_x64_linux_hotspot_11.0.28_6.tar.gz
  • 解压 JDK 11 安装包。
tar -zxvf OpenJDK11U-jdk_x64_linux_hotspot_11.0.28_6.tar.gz
  • 进入jdk11目录 cd ./jdk-11.0.28+6/
  • 配置 JDK 11 环境变量，供 Jenkins 调用
export JAVA_HOME=/root/docker/volumes/var/jenkins_home/tools/hudson.tasks.JAVA_JDKInstallation/jdk-11_linux-x64_bin/jdk-11.0.28+6

export PATH=$JAVA_HOME/bin:$PATH，将 JDK 的 bin 目录添加到系统 PATH，确保 java、javac 等命令全局可用

  • 创建JDK 8 （Jenkins 工具目录中 ）与jdk11差不多，不多赘述
  • mkdir -p /root/docker/volumes/var/jenkins_home/tools/hudson.tasks.JAVA_JDKInstallation/jdk-8_linux-x64_bin
  • cd /root/docker/volumes/var/jenkins_home/tools/hudson.tasks.JAVA_JDKInstallation/jdk-8_linux-x64_bin
  • wget https://mirrors.tuna.tsinghua.edu.cn/Adoptium/8/jdk/x64/linux/OpenJDK8U-jdk_x64_linux_hotspot_8u462b08.tar.gz
  • tar -zxvf OpenJDK8U-jdk_x64_linux_hotspot_8u462b08.tar.gz
  • cd ./jdk8u462-b08/

五、在 Jenkins 容器内配置 Docker 客户端

  • 创建Jenkins 工具目录中 Docker 客户端的安装路径
mkdir -p /root/docker/volumes/var/jenkins_home/tools/docker
  • 进入目录
cd /root/docker/volumes/var/jenkins_home/tools/docker
  • 下载docker的压缩包
wget https://download.docker.com/linux/static/stable/x86_64/docker-24.0.7.tgz
  • 解压

tar -zxvf docker-24.0.7.tgz

  • 进入目录
cd /root/docker/volumes/var/jenkins_home/tools/docker
  • 将子目录中的 Docker 移动到当前目录（扁平化结构）

此时会存在一个问题，在 docker 文件夹里存在一个名为 docker 的文件，将 docker 文件夹里的文件剪切出来的时候，由于文件与文件夹重名，所以可能会导致该文件剪切失败，可以通过 xftp 软件打开所在文件，将文件夹进行改名，再将文件夹里的文件粘贴出来，全粘贴出来时候便可删除该空文件夹（当然你也可以使用命令执行此操作～）

mv ./docker/* .

  • 谨慎命令 rm -rf ./docker

如果上一步操作改变了docker文件名字，这一步也需改变，如果直接在xftp8中直接删除了docker文件夹这一步不需执行

  • 进入 Jenkins 容器终端

docker exec -it jenkins /bin/sh

  • 查看容器内环境变量 PATH

echo $PATH

  • 为 Docker 客户端创建软链接到 PATH 目录下，使 docker 命令全局可用
ln -s /var/jenkins_home/tools/docker/docker /usr/local/bin/docker
  • 验证 Docker 客户端是否安装成功（显示版本即正常）

docker -v

  • 退出容器 exit

六、构建 Java 基础镜像

  • 查看本地镜像（确认基础镜像是否存在）

docker images

  • 进入jdk11目录
cd /root/docker/volumes/var/jenkins_home/tools/hudson.tasks.JAVA_JDKInstallation/jdk-11_linux-x64_bin
  • 基于当前目录的 Dockerfile 构建标签为 java:11 的镜像（供后端项目运行）

docker build -t java:11 . 执行此命令需要在该目录下放置一个 dockerfile 文件。

Dockerfile下载
  • 确认 java:11 镜像是否构建成功

docker images

  • 进入 JDK 8 目录
cd /root/docker/volumes/var/jenkins_home/tools/hudson.tasks.JAVA_JDKInstallation/jdk-8_linux-x64_bin
  • 构建标签为 java:8 的镜像

docker build -t java:8 .

执行该命令也需要 dockerfile 文件，记得Dockerfile中指定的文件路径 ADD OpenJDK8U-jdk_x64_linux_hotspot_8u462b08.tar.gz /usr/local/java/把文件名改成这个jdk8目录下的压缩包的名字

  • 确认 java:8 镜像是否构建成功

docker images

七、Java 容器启停操作（验证 java:8 和 java:11 镜像是否能正常使用）–可不需要

  • 启动 java:8 镜像的容器，命名为 java_8，设置自动重启
    • docker run --name java_8 --restart always -i -d java:8
  • 查看 java_8 容器状态
    • docker ps -a
  • 进入 java_8 容器的交互终端
    • docker exec -it java_8 bash
    • docker exec -it java_8 /bin/bash
  • 删除停止状态的 java_8 容器
    • docker rm java_8
  • 强制删除运行中的 java_8 容器
    • docker rm -f java_8
  • 启动 java:11 镜像的容器，命名为 java_11
    • docker run --name java_11 --restart always -i -d java:11
  • 查看 java_11 容器状态
    • docker ps -a
  • 进入 java_11 容器的交互终端
    • docker exec -it java_11 bash
    • docker exec -it java_11 /bin/bash
  • 删除停止状态的 java_11 容器
    • docker rm java_11
  • 强制删除运行中的 java_11 容器
    • docker rm -f java_11

二、前后端项目部署

云端环境 部署统一路径： 

前端项目根路径：

/root/docker/volumes/nvm/usr/local/nvm/v0.40.1/personal_blog/Vue3

后端项目根路径： /root/docker/volumes/blog/APIServer/personal_blog

添加 settings-yanxikeji 文件，并修改内容

一、前端环境搭建与部署（基于 Node.js 和 Vue）

1.构建 nvm 镜像并启动基础容器

  • 创建目录
mkdir -p /root/docker/volumes/var/jenkins_home/tools/hudson.tasks.nvmInstallation/nvm/v0.40.1
  • 进入 nvm 工具的安装目录
cd /root/docker/volumes/var/jenkins_home/tools/hudson.tasks.nvmInstallation/nvm/v0.40.1
  • 下载自定义的 nvm 镜像构建文件（Dockerfile）
wget -O ./custom-nvm-Dockerfile https://fchxqm.com/static/nvm/v0.40.1/custom-nvm-Dockerfile

-O ./custom-nvm-Dockerfile 指定下载文件的保存路径和名称（当前目录下的 custom-nvm-Dockerfile）

  • 基于下载的 Dockerfile 构建 nvm 镜像(如果下载失败，自行把文件在xftp8拖进去)
docker build -t custom_nvm:0.40.1 -f ./custom-nvm-Dockerfile .

-t custom_nvm:0.40.1：给镜像打标签（名称 custom_nvm，版本 0.40.1）；

-f ./custom-nvm-Dockerfile：指定使用当前目录的 custom-nvm-Dockerfile 作为构建文件；

.：表示构建上下文为当前目录（Docker 会读取该目录下的文件）。

  • 启动前端 nvm 容器并对外暴露端口
docker run --name custom_nvm_0.40.1 --restart always -p 80:3000 -v /root/docker/volumes/nvm/usr/local/nvm/v0.40.1:/usr/local/nvm/v0.40.1 -d custom_nvm:0.40.1

若 80 端口被占，自行换成相应没使用过的端口，或者把 80 端口释放。（我改了 81 端口）

—name custom_nvm_0.40.1：给容器命名（便于后续操作）；

—restart always：容器退出时自动重启（确保服务稳定运行）；

–p 80:3000 表示将宿主机的 80 端口映射到容器的 3000 端口（前端项目默认运行在容器的 3000 端口，外部通过服务器 80 端口访问）。

-v 宿主路径:容器路径：将宿主机的 nvm 数据目录挂载到容器内（持久化 nvm 配置，避免容器删除后数据丢失）；

-d：后台运行容器；

custom_nvm:0.40.1：基于该镜像启动容器。

2. 进入 nvm 容器配置前端环境

 docker ps -a

  • 进入运行中的 nvm 容器，打开交互终端（用于执行容器内命令)
 docker exec -it custom_nvm_0.40.1 /bin/bash
  • 安装nvm,全局安装Vue.js
nvm i 18.19.0 && node -v && npm i -g @vue/cli

-g 表示全局安装

  • 查看全局 npm 包

npm list -g --depth 0

二、后端部署流程（Java/Spring Boot）

1. 配置 Maven 和 JDK 环境变量（临时环境变量）

  • 将 Maven 的可执行文件路径添加到系统 PATH（使 mvn 命令全局可用）
 export PATH="$PATH:/root/docker/volumes/var/jenkins_home/tools/hudson.tasks.Maven_MavenInstallation/apache-maven-3.8.1/bin"  
  • 将 JDK 11 的可执行文件路径添加到 PATH（使 java、javac 命令全局可用）
 export PATH="$PATH:/root/docker/volumes/var/jenkins_home/tools/hudson.tasks.JAVA_JDKInstallation/jdk-11_linux-x64_bin/jdk-11.0.28+6/bin"
  • 进入后端项目目录（personal_blog，推测为 Spring Boot 项目根目录）
 cd /root/docker/volumes/blog/APIServer/personal_blog
  • 输出 Maven 版本信息（验证 Maven 是否配置成功）

  mvn -v

如果拒绝了权限访问

使用 chmod 命令更改文件或目录的权限
chmod +x /root/docker/volumes/var/jenkins_home/tools/hudson.tasks.Maven_MavenInstallation/apache-maven-3.8.1/bin/mvn

  • 强制删除旧的后端容器（-f 表示强制删除，即使容器正在运行）
mvn clean -s /root/docker/volumes/var/jenkins_home/tools/hudson.tasks.Maven_MavenInstallation/apache-maven-3.8.1/conf/settings-yanxikeji.xml -e -X
如果报错

查找是否是没把pom.xml文件加到现在的目录下

2.打包后端项目并进入容器

  • 进入后端目录
 cd /root/docker/volumes/blog/APIServer/personal_blog
  • 用 Maven 编译并打包项目为 JAR 文件
mvn package -s /root/docker/volumes/var/jenkins_home/tools/hudson.tasks.Maven_MavenInstallation/apache-maven-3.8.1/conf/settings-yanxikeji.xml
  • 进入已启动的 Java 容器（personal_blog_java_11），准备部署 JAR 包
 docker exec -it personal_blog_java_11 /bin/bash

3.重启后端容器并部署最新版本

  • 进入后端项目目录
cd /root/docker/volumes/blog/APIServer/personal_blog
  • 重新打包项目（确保使用最新代码）
 mvn package -s /root/docker/volumes/var/jenkins_home/tools/hudson.tasks.Maven_MavenInstallation/apache-maven-3.8.1/conf/settings-yanxikeji.xml
如果显示mvn: command not found或者是没有主类

1.重新添加Maven 的可执行文件路径添加到系统；2. 确认settings-yanxikeji文件中已经修改了，如果已经修改先mvn compile确保所有源代码都已成功编译，然后再次运行 mvn package

  • 强制删除旧的后端容器（-f 表示强制删除，即使容器正在运行）
docker rm -f personal_blog_java_11
  • 启动新的 Java 容器部署后端服务
 docker run --name personal_blog_java_11 --restart always -i -d -p 8080:8080 -v /root/docker/volumes/var/jenkins_home:/var/jenkins_home -v /root/docker/volumes/blog/APIServer/personal_blog:/usr/local/app/personal_blog java:11

-v 宿主项目路径:容器路径：将后端项目目录挂载到容器（便于容器读取 JAR 包）；

三、启动后端

  • 进入新后端容器，准备启动后端服务
 docker exec -it personal_blog_java_11 /bin/bash
cd /usr/local/app/personal_blog/target

tail -f -n 50 blog-backend-1.0.0_all.log

如果显示找不到java

#配置Java_Home的环境变量设置JAVA_HOME

export JAVA_HOME=/usr/local/java/jdk-11.0.28+6

#添加到PATH export PATH=$JAVA_HOME/bin:$PATH

#验证 java -version

永久配置环境变量

vi ~/.bashrc

#添加以下内容

export JAVA_HOME=/usr/local/java/jdk-11.0.28+6
export PATH=$JAVA_HOME/bin:$PATH

#使配置生效 source ~/.bashrc

#验证 java -version

如果找到Java还是显示failed to run command ‘java’

如果还是显示[root@4e1656274375 target]#tail -f -n 50 blog-backend-1.0.0_all.log
nohup: ignoring input
nohup: failed to run command 'java': No such file or directory是之前的 nohup 命令是在Java环境配置之前运行的，所以失败了。现在让我们重新运行应用：

java -jar blog-backend-1.0.0.jar

  • 实时查看日志文件的最后 50 行（-n 50），验证应用是否启动成功
 tail -f -n 50 blog-backend-1.0.0_all.log
端口被占用

如果出现端口被占用的情况，可能是因为前面已经执行过了，可以执行一下命令看端口被什么占用了： 
netstat -tunlp | grep 8080

然后再输入tail -f -n 50 blog-backend-1.0.0_all.log

四、启动前端

1. 进入前端容器

 docker exec -it custom_nvm_0.40.1 /bin/bash

2.进入前端项目根目录

 cd /usr/local/nvm/v0.40.1/personal_blog/Vue3

（说明：容器内路径与宿主机路径通过 -v 挂载关联，宿主机的 /root/docker/volumes/nvm/usr/local/nvm/v0.40.1 对应容器内的 /usr/local/nvm/v0.40.1）

3. 启动前端项目（开发环境 / 生产环境）

npm run serve 启动：启动后，前端服务会运行在容器的 3000 端口（默认，具体以项目配置为准），结合之前的端口映射（-p 80:3000），外部可通过 服务器IP:80 访问。

这样前端就启动成功啦！现在可以通过你的公网 IP 加前端容器映射的端口号进行访问啦～

Print Friendly, PDF & Email
文末附加内容
暂无评论

发送评论 编辑评论 


				

			

						

				

					

						

							

								
							

							
						

					

				

				

					

						

							

								
							

							
						

					

				

				

					

						

							

								
							

							
							
													

					

				

			

			
			

				

					
				

			

				

											

							
							
						

																

							
							
						

																

							
							
						

										
					
											
						

	

		
|´・ω・)ノ
ヾ(≧∇≦*)ゝ
(☆ω☆)
（╯‵□′）╯︵┴─┴
￣﹃￣
(/ω＼)
∠( ᐛ 」∠)＿
(๑•̀ㅁ•́ฅ)
→_→
୧(๑•̀⌄•́๑)૭
٩(ˊᗜˋ*)و
(ノ°ο°)ノ
(´இ皿இ｀)
⌇●﹏●⌇
(ฅ´ω`ฅ)
(╯°A°)╯︵○○○
φ(￣∇￣o)
ヾ(´･ ･｀｡)ノ"
( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃
(ó﹏ò｡)
Σ(っ °Д °;)っ
( ,,´･ω･)ﾉ"(´っω･｀｡)
╮(╯▽╰)╭
o(*////▽////*)q
＞﹏＜
( ๑´•ω•) "(ㆆᴗㆆ)
😂
😀
😅
😊
🙂
🙃
😌
😍
😘
😜
😝
😏
😒
🙄
😳
😡
😔
😫
😱
😭
💩
👻
🙌
🖕
👍
👫
👬
👭
🌚
🌝
🙈
💊
😶
🙏
🍦
🍉
😣
Source: github.com/k4yt3x/flowerhd
	

	

		
颜文字
Emoji
小恐龙
花!
	


									

			

			
			
		

	






上一篇
下一篇 

                    

                    
			        推荐文章
		            

		            

							
Git

							
							

							
依托workpress搭建网站

							
							

							
软件开发培训班笔记

							
							

							
Java后端从入门到放弃

							
							

							
Elasticsearch 8.10安装(windows)

							
							

							
workpress 文件权限+媒体库大小

							
							

							
世界，您好！

							
							

							
mysql,redis环境配置