本地环境
node.js
---用于打包ui(前端项目)下载地址https://nodejs.org/zh-cnjava
环境---用于部署api(后端项目)下载地址https://bell-sw.com/pages/downloads/#jdk-21-lts
(若Windows
系统应该还需安装Maven
)
服务器必备环境
Java17
及以上 MySQL
(8.0 及以上) Nginx
注意:Mysql
跟Nginx
可以通过宝塔面板进行一键安装
后端项目部署
一.数据库创建及 DDL
执行(Linux
操作系统下进行)此工程已将所有用到的 MySQL
建库与建表语句置于 sql/ddl
目录下。
1.执行此命令进入数据库(数据库密码可以通过宝塔面板数据库的root
来查看)
mysql -u root -p
2.在Mysql
中执行文件中/sql/ddl/database.sql
数据库中语句
CREATE DATABASE `boyouquan` DEFAULT CHARSET utf8mb4 COLLATE utf8mb4_general_ci;
3.建立好数据库之后可以用以下指令进行查看是否建立成功
♾️ text 代码:SHOW DATABASES;
4.执行好之后进入此数据库开始执行数据表(/sql/ddl/
文件下除database.sql
文件以外全部执行)
(1)使用以下指令进入此数据库
use boyouquan;
如果成功即会显示(不一定,不懂可以复制去问AI)
♾️ text 代码:Database changed
(2)开始复制各个文件内的数据表直接粘贴回车执行
5.各个数据表执行完成之后需对user
插入一句进行后端的账号密码写进
-- root/root(这里就不要复制了)
INSERT INTO `user` (`username`, `md5password`, `role`, `deleted`)
VALUES ('root', md5('root'), 'admin', false);
VALUSE
后为账号,md5
后为密码
二.编译与运行
1.地项目目录下使用如下 Maven
命令进行打包:
./mvnw clean package
(本地系统是Windows
的话直接在项目文件中右键选择'在终端中打开'进入powershell
使用此命令,Liunx
好像也最进入在文件下使用命令,不然怕命令找不着文件)
2.上传服务器
(1)build
完成后,根目录生成一个target
文件夹,本地进入文件夹之后如上使用powershell
并使用以下指令传输到服务器,传输target
文件中的boyouquan-2.0.jar
文件即可
scp boyouquan-2.0.jar root@ip:/usr/app
这样就把jar
传到主机的 /usr/app
目录下了,当然目录是可以改的,看你个人(反正我随便放到根目录下了)
(2)当然使用有图形管理的宝塔面板也是同理,上传到根目录下任何一个文件夹即可,(也不一定,反正后续操作你能找到这个文件路径进行操作也行),或使用有文件管理的ssh
工具直接压缩上传也可以。
2.build
打包完成后,使用如下命令设置环境变量,并运行(这里我是在服务器中进行的,因为我本地没有安装Mysql
)
export DATABASE_URL="jdbc:mysql://localhost:3306/boyouquan?autoReconnect=true&useUnicode=true&characterEncoding=utf-8&allowMultiQueries=true&serverTimezone=GMT%2B8"
export DATABASE_USER=root # 换成你的账号
export DATABASE_PASSWORD=root # 换成你的密码
export EMAIL_ENABLE=false
(注意这里的账号密码是你的root
用户的数据库账号密码)操作完成之后没有任何显示是正常的
3.运行项目
java -jar ./target/boyouquan-api-2.0.jar
注意这里的./target/
是作者的boyouquan-api-2.0.jar
文件路径,个人将它替换成自己文件的所在路径即可
三.查看是否运行成功
1.程序启动后,尝试使用命令行或在浏览器访问一下博客列表 API(http://localhost:8080/api/blogs
),无初始数据,所以会返回一个空列表。
服务器中使用指令
curl http://localhost:8080/api/blogs
若返回
♾️ text 代码:{"pageNo":1,"pageSize":10,"total":0,"results":[]}
即表示成功
至此,后端程序启动成功,接下来可以接着启动 前端程序 ,启动成功后即可以进行整体调试与测试了。
前端项目部署
1.在本地进行打包,所需的环境依赖我开头已经说了
(1)将前端项目文件下载后,Window
系统仍在项目文件中右键选择'在终端中打开'进入powershell
,然后输入以下指令
npm
查看是否下载成功。
2.进行安装
npm install
3.修改\boyouquan-ui-2.1\conf\nginx
中的boyouquan.conf
文件
(1)若无配置ssl证书请把该文件中的大约5-19行进行删除,还有相关域名换成自己的,https
也修改成http
# 301 重定向到 HTTPS
return 301 https://emolo.cn/$request_uri;
}
server {
listen 443 ssl;
server_name emolo.cn;
# SSL 配置
ssl_certificate /usr/share/nginx/cert/emolo.cn_bundle.crt;
ssl_certificate_key /usr/share/nginx/cert/emolo.cn.key;
ssl_session_timeout 5m;
ssl_protocols TLSv1.2; # 只使用 TLS 1.2
ssl_ciphers 'HIGH:!DH:!EXPORT:!RC4:!LOW:!aNULL:!eNULL'; # 更加安全的加密套件
ssl_prefer_server_ciphers on;
(2)若配置了ssl
证书就无视删除代码操作,将域名替换为自己的即可,https
也修改成http
3.对前端项目进行打包,使用以下指令(记得提前将项目中的.env
文件中的url地址进行修改成自己绑定的域名再打包)
npm run build --mode=production
注意事项
1.后端项目我是直接在根目录下新建文件夹之后把build
好之后的文件直接放入
2.前端项目dist之后的文件我把项目放在了./usr/share/nginx
文件夹下
3.因为我是用宝塔面板安装的Nginx,所以为我们的修改后的conf文件必须放在./www/server/panel/vhost/nginx/
这个目录下
4.前端项目中.env.production
和.env
都要进行修改
5.Windows
系统不知道怎么回事(有玄学),好像每一次构建都要先安装webpack
,执行以下命令
npm install webpack webpack-cli --save-dev
Github项目前端地址https://github.com/leileiluoluo/boyouquan-ui
Github项目后端地址https://github.com/leileiluoluo/boyouquan-api
{tip type="success"}郑重感谢作者的亲力指导{/tip}
搬家
后期想搬家的时候所有操作也都可以通过面板进行操作,数据库可以通过
进行同步,然后就会看见boyouquan的数据库,密码也是在部署之前所填的变量中的密码,而项目文件就在面板中找到打包下载上传到新服务器即可。