目录
4.在mydata目录下创建Dockerfile文件，编写Dockersfile文件
6.基于二级域名配置两个项目（必须要有域名才可以操作）没有直接看7 看6不看7
前端项目地址
后端项目地址
1.前置工作
Docker安装
Docker运行环境要求系统为64位、Linux系统内核版本为 3.8以上
查看自己虚拟机的内核：
cat /etc/redhat-release
开始安装：
1.搭建gcc环境（gcc是编程语言译器）
yum -y install gcc yum -y install gcc-c++
2.安装需要的软件包
yum install -y yum-utils
3.安装镜像仓库
使用阿里云镜像仓库
yum-config-manager --add-repo http://mirrors.aliyun.com/docker-ce/linux/centos/docker-ce.repo
4.更新yum软件包索引
yum makecache fast
5.安装docker引擎
yum install docker-ce docker-ce-cli containerd.io docker-compose-plugin
6.启动docker
systemctl start docker
查看docker版本信息
docker version
7.拉取镜像
拉取镜像java:8(jdk1.8) docker pull java:8 拉取镜像mysql docker pull mysql:8.0.19 拉取镜像redis:6.0.8 docker pull redis:6.0.8 拉取镜像nginx:1.20 docker pull nginx:1.20
查看当前所有镜像：
docker images
2.docker容器
1.docker所需镜像：
-
java:8（jdk1.8）
-
mysql:8+
-
redis:6.0.8
-
nginx:1.20
2.mysql8+ 安装
1.创建mysql实例
docker run -d -p 3306:3306 --privileged=true \ -v /mysql/log:/var/log/mysql \ -v /mysql/data:/var/lib/mysql \ -v /mysql/conf:/etc/mysql \ -v /mysql/mysql-files:/var/lib/mysql-files/ \ -e MYSQL_ROOT_PASSWORD=123456 -d mysql:latest
docker ps # 查看容器是否正常运行
2.创建配置文件
vi /mydata/mysql/conf/my.cnf
=====配置内容===== [client] default-character-set=utf8mb4 [mysql] default-character-set=utf8mb4 [mysqld] init_connect='SET collation_connection = utf8mb4_unicode_ci' init_connect='SET NAMES utf8mb4' character-set-server=utf8mb4 collation-server=utf8mb4_unicode_ci skip-character-set-client-handshake
2.开启mysql远程登陆
use mysql; update user set host='%' where user='root'; Grant all privileges on root.* to 'root'@'%'; #执行两次 alter user root identified with mysql_native_password by '新密码'; ALTER USER 'root'@'localhost' IDENTIFIED BY '新密码'; # 修改root密码 FLUSH PRIVILEGES; show variables like 'character%'; # 查看字符编码
docker安装完MySQL并run出容器后，建议请先修改完字符集编码后再新建mysql库-表-插数据
3. redis安装
1.注意中文乱码和数据备份,降低坐牢风险
mkdir -p /mydata/redis/conf touch /mydata/redis/conf/redis.conf
2.redis.conf
拷贝官方redis.conf文件到/mydata/redis/conf/redis.conf (注意切勿创建成redis.conf目录)
# ---------vi redis.conf -------------- # 修改如下内容 requirepass 密码 masterauth 密码 # bind 127.0.0.1 protected-mode no daemonize no #docker -d 具有守护线程功能,防止docker冲突 # -------------------------------------
docker run -p 6379:6379 --name redis --privileged=true \ -v /mydata/redis/conf/redis.conf:/etc/redis/redis.conf \ -v /mydata/redis/data:/data \ --restart=always \ -d redis:6.0 redis-server /etc/redis/redis.conf
3.查看是否启动容器成功
docker ps
4. nginx安装
1.首先进入目录/mydata/nginx
cd /mydata/nginx
2.创建一个nginx容器，只是为了复制出配置
# 1.运行容器 docker run -p 80:80 --name nginx -d nginx:1.20 # 2.将容器内的配置文件拷贝到当前目录/mydata/nginx中 docker container cp nginx:/etc/nginx . # 3.将文件nginx修改为conf mv nginx conf # 4.创建文件夹nginx mkdir nginx # 5.将conf目录拷贝到nginx目录 cp -r conf nginx/ # 6.删除conf目录 rm -rf conf # 3.停止并删除容器 docker stop nginx && docker rm nginx
3.部署后端jar包
1.修改后端配置文件ip
修改后端项目的application.yaml文件，将MySQL服务和Redis服务的localhost修改为服务器ip
2.后端项目打包
后端项目使用maven打包 打包后在target目录下生成对应模块的jar包
1.解决打包问题
-
SpringBoot版本升到2.6以上
-
修改pom文件
父pom
</dependencyManagement>
<build>
<plugins>
<plugin>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId>
<version>2.3.4.RELEASE</version>
</plugin>
<!-- 此插件必须放在父 POM 中 -->
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-assembly-plugin</artifactId>
<version>3.3.0</version>
<executions>
<!--
执行本插件的方法为，在主目录下执行如下命令：
mvn package assembly:single
对于 IntelliJ IDEA，生成的 JAR 包位于每个模块下的文件夹 target
-->
<execution>
<id>make-assembly</id>
<phase>package</phase>
<goals>
<!-- 此处 IntelliJ IDEA 可能会报红，这是正常现象 -->
<goal>single</goal>
</goals>
</execution>
</executions>
<configuration>
<archive>
<manifest>
<!-- 配置程序运行入口所在的类 -->
<mainClass>com.lxs.LXSAdminApplication</mainClass>
</manifest>
<manifest>
<!-- 配置程序运行入口所在的类 -->
<mainClass>com.lxs.LXSBlogApplication</mainClass>
</manifest>
</archive>
<!-- 设置 JAR 包输出目录 -->
<outputDirectory>${project.build.directory}/#maven-assembly-plugin</outputDirectory>
<!-- 设置打包后的 JAR 包的目录结构为默认 -->
<descriptorRefs>
<descriptorRef>jar-with-dependencies</descriptorRef>
</descriptorRefs>
</configuration>
</plugin>
</plugins>
</build>
</project>
子模块sangeng-blog和子模块sangeng-admin的pom文件
<build>
<plugins>
<plugin>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId>
<executions>
<execution>
<goals>
<goal>repackage</goal>
</goals>
</execution>
</executions>
</plugin>
</plugins>
<finalName>${project.artifactId}</finalName>
</build>
-
解决SpringBoot2.6的循环依赖
在子模块sangeng-blog和子模块sangeng-admin的application.yml文件中Spring后加
main: allow-circular-references: true
-
解决SpringBoot2.6与swagger2的版本冲突问题
在子模块sangeng-blog和子模块sangeng-admin的application.yml文件中Spring后加
mvc: pathmatch: matching-strategy: ANT_PATH_MATCHER
2.项目打包，本地运行jar包测试
在这之前首先修改配置文件中的mysql和redis服务ip地址
在父pom下首先clean清除先前的jar包，再install打包.（单模块项目首先clean清除先前的jar包，再package打包）
进入target目录下，在文件搜索框输入cmd进入Dos窗口，使用命令运行jar包
java -jar jar包
若未报错则jar包没有问题
3.将jar包传到服务器指定目录下
我这里是在根目录下创建了一个/mydata/jar目录
可以选择这种部署jar包方式，jar包出现错误直接更换就可以
docker部署jar包,支持热更新jar包
4.在mydata目录下创建Dockerfile文件，编写Dockersfile文件
这里我们两个jar包分别打成两个镜像，因为一个目录下只能有一个Dockerfile文件，所以当构建完第一个镜像之后修改对应的Dockerfile文件。
第一个Dockerfile文件
#基础镜像使用jdk1.8 FROM java:8 #作者 MAINTAINER LPIU # VOLUME 指定临时文件目录为/tmp，在主机/var/lib/docker目录下创建了一个临时文件并链接到容器的/tmp VOLUME /tmp # 将jar包添加到容器中并更名 ADD LXSBlog-blog.jar LXSBlog-blog.jar # 运行jar包 RUN bash -c 'touch /LXSBlog-blog.jar' ENTRYPOINT ["java","-jar","/LXSBlog-blog.jar"] #暴露7777端口作为微服务 EXPOSE 7777
构建镜像
docker build -t lxsblog-blog:1.0 .
查看构建的镜像
docker images
第二个Dockerfile文件
#基础镜像使用jdk1.8 FROM java:8 #作者 MAINTAINER LPIU # VOLUME 指定临时文件目录为/tmp，在主机/var/lib/docker目录下创建了一个临时文件并链接到容器的/tmp VOLUME /tmp # 将jar包添加到容器中并更名 ADD LXSBlog-admin.jar LXSBlog-admin.jar # 运行jar包 RUN bash -c 'touch /LXSBlog-admin.jar' ENTRYPOINT ["java","-jar","/LXSBlog-admin.jar"] #暴露7777端口作为微服务 EXPOSE 8989
5.使用Docker-compose容器编排
注意：如果是低版本的compose，docker和compose之间要有-
首先查看主机是否有docker-compose环境
docker compose version
如果没有就安装docker-compose
6编写docker-compose.yml文件
在/mydata目录下创建docker-compose.yml文件，并编写docker-compose.yml文件 在vim模式下 :set paste粘贴的文本数据不会乱
#compose版本
version: "3"
services:
lxsblog-blog:
#微服务镜像
image: lxsblog:1.0
container_name: lxsblog-blog
ports:
- "7777:7777"
#数据卷
volumes:
- /applxsblog-blog:/data/lxsblog-blog
networks:
- blog_network
lxsblog-admin:
#微服务镜像
image: lxsblog-admin:1.0
container_name: lxsblog-admin
ports:
- "8989:8989"
#数据卷
volumes:
- /app/lxsblog-admin:/data/lxsblog-admin
networks:
- blog_network
#创建自定义网络
networks:
blog_network:
检查当前目录下compose.yml文件是否有语法错误
docker compose config -q
启动所有docker-compose服务并后台运行
docker compose up -d
查看正在运行的容器实例
7.测试后端接口
使用ApiFox进行接口测试（postman也可以）
测试通过
4.部署前端
1.修改前端对应的服务器ip
-
使用快捷键
ctrl+shift+R全局搜索，将原来的localhost更改为对应的服务器ip -
将原来的开发环境和生产环境的
VUE_APP_BASE_API都更改为你的服务器ip和后端子模块端口
2.前端项目打包
1.前端sangeng-blog模块项目使用下面命令打包
npm run build
2.前端sangeng-admin模块项目使用下面命令打包
注意：因为后端使用的是Finclip提供的模板，所以生产环境使用的是npm run build:prod，如果你没有使用提供的模板，就直接使用npm run build命令。
npm run build:prod
如果你打包的过程中出现以下错误，表示 node.js版本过高，可以关闭node.js安全校验后再打包
set NODE_OPTIONS=--openssl-legacy-provider
如果使用出现ERROR，请注释掉main.js的
if (process.env.NODE_ENV === 'production') {
const { mockXHR } = require('../mock')
mockXHR()
}
3.本地测试
1.将已经打包好的前端项目放到本地Nginx里面测试
将dist文件直接放到html目录下 在conf文件中修改nginx.conf文件，在http{......}中添加内容如下
server {
listen 8094;
server_name localhost;
location / {
#dist文件所在目录
root html/dist;
index index.html index.htm;
#解决刷新404的问题
try_files $uri $uri/ /index.html;
}
}
点击nginx.exe运行nginx服务
2.访问对应的ip+端口号
3.问题
放在Nginx里面测试发现后台只有登录和左边menu能够显现，原因是因为Route目录下的index.js有问题，只有/login和/dashborad
解决方式：
参照阳光的部署，原文链接：超详细Docker部署SpringBoot+Vue项目（三更博客项目部署）_三更博客部署_☜阳光的博客-CSDN博客
替换掉Route目录下的index.js
import Vue from 'vue'
import Router from 'vue-router'
Vue.use(Router)
/* Layout */
import Layout from '@/layout'
export const constantRoutes = [
{
path: '/login',
component: () => import('@/views/login/index'),
hidden: true
},
{
path: '/',
component: Layout,
redirect: '/dashboard',
children: [{
path: 'dashboard',
name: 'Dashboard',
component: () => import('@/views/dashboard/index'),
meta: { title: '首页', icon: 'dashboard' }
}]
},
{
path: '/write',
component: Layout,
children: [{
path: '/',
name: 'Write',
component: () => import('@/views/content/article/write/index'),
hidden: true
}]
},
{
path: '/system/user',
component: Layout,
children: [{
path: '/',
name: 'User',
component: () => import('@/views/system/user'),
hidden: true
}]
},
{
path: '/system/role',
component: Layout,
children: [{
path: '/',
name: 'role',
component: () => import('@/views/system/role'),
hidden: true
}]
},
{
path: '/system/menu',
component: Layout,
children: [{
path: '/',
name: 'menu',
component: () => import('@/views/system/menu'),
hidden: true
}]
},
{
path: '/system/role',
component: Layout,
children: [{
path: '/',
name: 'role',
component: () => import('@/views/system/role'),
hidden: true
}]
},
{
path: '/content/article',
component: Layout,
children: [{
path: '/',
name: 'article',
component: () => import('@/views/content/article/index'),
hidden: true
}]
},
{
path: '/content/category',
component: Layout,
children: [{
path: '/',
name: 'category',
component: () => import('@/views/content/category/index'),
hidden: true
}]
},
{
path: '/content/link',
component: Layout,
children: [{
path: '/',
name: 'link',
component: () => import('@/views/content/link/index'),
hidden: true
}]
},
{
path: '/content/tag',
component: Layout,
children: [{
path: '/',
name: 'tag',
component: () => import('@/views/content/tag/index'),
hidden: true
}]
}
]
const createRouter = () => new Router({
// mode: 'history', // require service support
scrollBehavior: () => ({ y: 0 }),
routes: constantRoutes
})
const router = createRouter()
// Detail see: https://github.com/vuejs/vue-router/issues/1234#issuecomment-357941465
export function resetRouter() {
const newRouter = createRouter()
router.matcher = newRouter.matcher // reset router
}
export default router
4.重新打包，再将dist文件直接放到html目录下
重新运行
blog也这样测试一下
5.dist上传到服务器上
上传到/nginx下的html包中
6.基于二级域名配置两个项目（必须要有域名才可以操作）没有直接看7 看6不看7
修改default.conf配置文件
在/mydata/nginx/conf/conf.d/default.conf添加如下
server {
listen 80;
server_name blog.music-liu.cn;
location / {
root /usr/share/nginx/html/blog_dist;
index index.html;
}
include /etc/nginx/default.d/*.conf;
error_page 404 /404.html;
location = /404.html {
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
}
}
server {
listen 80;
server_name admin.music-liu.cn;
location / {
root /usr/share/nginx/html/blog_dist;
index index.html;
}
include /etc/nginx/default.d/*.conf;
error_page 404 /404.html;
location = /404.html {
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
}
}
7.基于location配置两个项目
修改default.conf配置文件
在/mydata/nginx/conf/conf.d/default.conf添加如下
server {
listen 8093;
server_name localhost;
location / {
root /usr/share/nginx/html/blog_dist;
index index.html index.htm;
try_files $uri $uri/ /index.html;
}
}
server {
listen 8094;
server_name localhost;
location / {
root /usr/share/nginx/html/admin_dist;
index index.html index.htm;
try_files $uri $uri/ /index.html;
}
}
8.运行容器
docker run -p 80:80 --name nginx --privileged=true --restart=always -v /mydata/nginx/html:/usr/share/nginx/html -v /mydata/nginx/logs:/var/log/nginx -v /mydata/nginx/conf:/etc/nginx -d nginx:1.20
5.项目测试
5186
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
