NBlog 部署记录. (暂时完结)
因为以前不支持图床,所以都是文字😔
说在前面,我建议,你可以从一个新的镜像开始,并且是centos系列的,我的是centos7.如果这样,你会省去很多功夫,也可以跳过那些移除旧版本的内容。
Step1. 安装并且配置前置Redis 和 MySQL,JDK1.8,Maven,Nodejs(By nvm)
Redis:
我的建议是用docker来管理和启动redis。
而且要pull特定redis也更容易。
1.docker的安装和配置:
centos
卸载历史版本:
yum remove docker \
docker-client \
docker-client-latest \
docker-common \
docker-latest \
docker-latest-logrotate \
docker-logrotate \
docker-selinux \
docker-engine-selinux \
docker-engine \
docker-ce
然后,我建议使用宝塔面板,点击docker,安装即可。仓库什么的宝塔会配置好。
ps:现在国内docker镜像应该没办法正常使用,甚至安装都是问题。
但我依然推荐使用,这里是参考解法: 使用docker安装和使用MYSQL ---
2.MYSQL安装
如果是新开的镜像,直接宝塔面板数据库里的MYSQL,不必配置。直接完成一半的工作。
sudo service mysql start # MySQL启动
3.redis安装和配置
docker search redis
docker pull redis:5.0.5
不建议使用高版本的redis。因为涉及到配置redisconfig,不同版本的conf不同。修改这些内容。
bind 127.0.0.1 #注释掉这部分,使redis可以外部访问
daemonize no#用守护线程的方式启动
requirepass 123456#给redis设置密码
appendonly yes#redis持久化 默认是no
官方下载地址:
https://redis.io/docs/latest/operate/oss_and_stack/management/config/
选择5.0的下载即可。
配置完后。创建目录:
/data
/data/redis
cp redis.conf /data/redis/
复制配置文件到指定目录。
运行redis:
sudo docker stop redis #如果有启动中的redis
sudo docker rm redis #就关闭该容器
sudo docker run -p 6379:6379 --name redis \
-v /data/redis/redis.conf:/etc/redis/redis.conf \
-v /data/redis/data:/data -d redis:5.0.5 \
redis-server /etc/redis/redis.conf --appendonly yes
4.jdk1.8的安装:
我们使用作者搭建项目用的java版本。防止构建项目后因为版本问题无法运行代码。
在这之前,查看自己是否安装过其他版本:
rpm -qa |grep java
如果像这样:
[root@localhost ~]$ rpm -qa |grep java
java-1.8.0-openjdk-1.8.0.65-3.b17.el7.x86_64
java-1.7.0-openjdk-headless-1.7.0.91-2.6.2.3.el7.x86_64
javapackages-tools-3.4.1-11.el7.noarch
java-1.8.0-openjdk-headless-1.8.0.65-3.b17.el7.x86_64
nuxwdog-client-java-1.0.3-2.el7.x86_64
java-1.7.0-openjdk-1.7.0.91-2.6.2.3.el7.x86_64
mysql-connector-java-5.1.25-3.el7.noarch
python-javapackages-3.4.1-11.el7.noarch
tzdata-java-2015g-1.el7.noarch
javassist-3.16.1-10.el7.noarch
java-1.7.0-openjdk-devel-1.7.0.91-2.6.2.3.el7.x86_64
javamail-1.4.6-8.el7.noarch
那么你需要手动把这些都移除掉。
当然你要知道自己在干什么: 如果你能判断每个名称是什么,那么只需要移除掉openjdk相关的就可以。javascript就大可不必。但我们讨论的是纯小白的情况,那么就都移除。当然如果是小白,我更建议从0开始,也就是从一开始新建一个镜像来做这些。
你可以像这样移除:
rpm -e --nodeps xxx #替换xxx
# 比如这样:
rpm -e --nodeps java-1.8.0-openjdk-1.8.0.65-3.b17.el7.x86_64
关于下载jdk:
我建议到官网自己下载,寻找适合自己系统的版本,我下了别人百度网盘的因为一个arm和amd的问题卡了相当久,只是因为为了节省官网注册和填写信息的五分钟。
官网:
https://www.oracle.com/java/technologies/javase/javase8-archive-downloads.html
下载后我是解压到/home/local/java/下。
ps:如果你不会解压的话,你可以考虑使用宝塔面板。
然后配置~/.bashrc ,直接加入到最后一行之后:
export JAVA_HOME=/home/local/java/jdk1.8.0_271
export PATH=$JAVA_HOME/bin:$PATH
export CLASSPATH=.:$JAVA_HOME/lib/dt.jar:$JAVA_HOME/lib/tools.jar
你需要改的是jdk1.8.0_271后面的数字,把它改成你解压后的文件夹的名字。
之后在终端运行:
source ~/.bashrc
java -version
5.Maven的安装:
我提到了我忘记了如何安装maven,也许是因为我没有在这里碰壁。我似乎是gpt直接给了我安装代码。
你也可以参考这个:
https://blog.csdn.net/qq_38738510/article/details/105567513
6.Nodejs的版本管理和切换:
这个人讲得非常好,而且还很可爱,还附带文字教程。
url:https://www.bilibili.com/video/BV12h411z7Kq/?spm_id_from=333.880.my_history.page.click&vd_source=d7601f0fc447d708fff71aa75186ea10
如果到这里都没有报错,那么恭喜你。我在这些上面就已经花了一个晚上和一个下午的时间。
Step2.启动前置MYSQL和redis服务器:
如果你已经完成前面的配置,那么可以直接运行:
Step2: 启动前置. redis 和 MYSQL
为你整理可以配置开机自启动的几行。
sudo docker stop redis
sudo docker rm redis
sudo docker run -p 6379:6379 --name redis -v /data/redis/redis.conf:/etc/redis/redis.conf \
-v /data/redis/data:/data -d redis:5.0.5 redis-server /etc/redis/redis.conf --appendonly yes
sudo service mysql start
这个可以设置成每次开机自动运行。
Step3.创建和修改配置文件:
我们的目的是配置前台后台端口,后端服务端口。然后编写server.js启动前台后台。
我的配置是,8079前台页面端口,8080后台页面端口,8090后端的端口api。
首先是后端blog-api中的文件夹配置:
1.blog-api/src/main/resources/application-dev.properties:
# 服务器端口号
server.port=8090
# 博客名称
blog.name=Naccl's Blog
# 生产环境需要修改为服务器ip或域名
# 后端服务URL
blog.api=http://xxx.xxx.xxx.xxx:${server.port}
# 后台管理URL https://admin.naccl.top
blog.cms=http://xxx.xxx.xxx.xxx:8080
# 前台界面URL https://naccl.top
blog.view=http://xxx.xxx.xxx.xxx:8079
# 更改xxx为你的服务器公网ip,我们目前配置公网ip访问。
# 数据库连接信息
spring.datasource.driver-class-name=com.mysql.cj.jdbc.Driver
spring.datasource.url=jdbc:mysql://localhost:3306/nblog?useUnicode=true&characterEncoding=utf8&useSSL=false&serverTimezone=GMT%2B8
spring.datasource.username=root #保持root
spring.datasource.password=root #M改成MYSQL的root密码.
# Redis连接信息
# 默认配置,因为我之前示例里面启动redis的时候设置密码为123456,如果你设置不同,用你的密码。
spring.redis.host=localhost
spring.redis.password=123456
spring.redis.port=6379
spring.redis.database=0
spring.redis.timeout=10000ms
暂时更改以上部分即可,保证除了我让你更改的内容,其余的你都和我一致。
关于数据库导入:
原仓库作者留下了一个nblog.sql在blog-api中。
我是使用宝塔面板,创建一个叫nblog的数据库,密码无所谓。然后管理,把sql文件里面的内容复制到宝塔面板的sql执行页面。然后nblog的数据库就会被初始化成作者设定的样子。
关于服务端口的打开:
你可以使用比如腾讯云自带的安全组去新建规则添加8079,8080,8090,tcp.
或者使用firewall指定打开然后reload。但是我不会写,你可以去问gpt.
2.blog-api/src/main/java/top/naccl/config/WebConfig.java:
package top.naccl.config;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.CorsRegistry;
import org.springframework.web.servlet.config.annotation.InterceptorRegistry;
import org.springframework.web.servlet.config.annotation.ResourceHandlerRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;
import top.naccl.config.properties.UploadProperties;
import top.naccl.interceptor.AccessLimitInterceptor;
@Configuration
public class WebConfig implements WebMvcConfigurer {
@Autowired
AccessLimitInterceptor accessLimitInterceptor;
@Autowired
UploadProperties uploadProperties;
@Override
public void addCorsMappings(CorsRegistry registry) {
registry.addMapping("/**")
.allowedOrigins("http://xxx.xxx.xxx.xxx:8080", "http://xxx.xxx.xxx.xxx:8079")
.allowedHeaders("*")
.allowedMethods("GET", "POST", "PUT", "DELETE", "HEAD", "OPTIONS")
.allowCredentials(true)
.maxAge(3600);
}
@Override
public void addInterceptors(InterceptorRegistry registry) {
registry.addInterceptor(accessLimitInterceptor);
}
@Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
registry.addResourceHandler(uploadProperties.getAccessPath())
.addResourceLocations(uploadProperties.getResourcesLocations());
}
}
以上是我的配置,把xxx.xxx.xxx.xxx改成你的公网Ip.
配置完这些后你可以尝试,回到blog-api目录下,然后运行:
mvn clean install #这个可能要挺久,耐心,如果没有报错的话。
mvn package
配置blog-view的前端内容.
3.创建blog-view/server.js:
我的内容:
const express = require('express');
const cors = require('cors');
const path = require('path');
const app = express();
const corsOptions = {
origin: 'http://<你的服务器公网IP>:8079',
methods: 'GET,HEAD,PUT,PATCH,POST,DELETE',
credentials: true,
optionsSuccessStatus: 204
};
app.use(cors(corsOptions));
app.use(express.static('./dist'));
app.get('*', function(req, res) {
res.sendFile(path.resolve(__dirname, 'dist', 'index.html'));
});
const port = 8079;
app.listen(port, function (err) {
if (err) {
console.log(err);
return;
}
console.log('Listening at http://localhost:' + port + '\n');
});
老规矩,改xxx.
4.修改blog-view/src/plugins/axios.js:
直接给出代码,其他部分保持不变即可:
[root@VM-20-6-centos blog-view]# cat src/plugins/axios.js
import axios from "axios";
import NProgress from 'nprogress'
import 'nprogress/nprogress.css'
const request = axios.create({
baseURL: 'http://xxx.xxx.xxx.xxx:8090/',
timeout: 10000,
})
你需要修改的主要是baseURL的xxx和那个端口改成8090对应我们blog-api的地址。
5.创建blog-cms/server.js:
server.js:
const express = require('express');
const cors = require('cors');
const path = require('path');
const app = express();
const corsOptions = {
origin: 'http://<你的服务器公网IP>:8079',
methods: 'GET,HEAD,PUT,PATCH,POST,DELETE',
credentials: true,
optionsSuccessStatus: 204
};
app.use(cors(corsOptions));
app.use(express.static('./dist'));
app.get('*', function(req, res) {
res.sendFile(path.resolve(__dirname, 'dist', 'index.html'));
});
const port = 8079;
app.listen(port, function (err) {
if (err) {
console.log(err);
return;
}
console.log('Listening at http://localhost:' + port + '\n');
});
修改xxx.
6.修改blog-cms/src/util/request.js:
[root@VM-20-6-centos blog-cms]# cat src/util/request.js
import axios from 'axios'
import NProgress from 'nprogress'
import 'nprogress/nprogress.css'
import {Message} from 'element-ui'
const request = axios.create({
baseURL: 'http://xxx.xxx.xxx.xxx:8090/admin/',
timeout: 5000
})
这个就是文件开头,保持其他部分不变,修改xxx,修改成8090.
Step4.build项目.
1.blog-view&blog-cms:
我演示一遍:
我删除掉Build生成的dist和install生成的node_modules来让我和你的情况一致。
[root@VM-20-6-centos blog-view]# ls
babel.config.js node_modules package-lock.json README.md src
dist package.json public server.js vue.config.js
[root@VM-20-6-centos blog-view]# rm dist/ node_modules/ -rf
[root@VM-20-6-centos blog-view]# ls
babel.config.js package-lock.json README.md src
package.json public server.js vue.config.js
你会看到说它说存在很多问题,但是我们可以不管。我试图去修复问题后反而无法Build项目,而我在这种情况下直接build,反而不会报错。
[root@VM-20-6-centos blog-view]# nvm use 14
Now using node v14.21.3 (npm v6.14.18)
[root@VM-20-6-centos blog-view]# npm install
> core-js@2.6.11 postinstall /home/local/NBlog/blog-view/node_modules/babel-runtime/node_modules/core-js
****
added 1363 packages from 586 contributors and audited 1367 packages in 28.676s
87 packages are looking for funding
run `npm fund` for details
found 198 vulnerabilities (2 low, 117 moderate, 59 high, 20 critical)
run `npm audit fix` to fix them, or `npm audit` for details
╭────────────────────────────────────────────────────────────────╮
│ │
│ New major version of npm available! 6.14.18 → 10.8.1 │
│ Changelog: https://github.com/npm/cli/releases/tag/v10.8.1 │
│ Run npm install -g npm to update! │
│ │
╰────────────────────────────────────────────────────────────────╯
我们直接npm run build: (在这之前npm install cors)记得。
[root@VM-20-6-centos blog-view]# npm run build
> blog-view@1.0.0 build /home/local/NBlog/blog-view
> vue-cli-service build
*****
Images and other types of assets omitted.
DONE Build complete. The dist directory is ready to be deployed.
INFO Check out deployment instructions at https://cli.vuejs.org/guide/deployment.html
可以看到成功build.
你可以用
nohup node server.js &
来启动我们的页面,因为我的服务器正在运行,会端口冲突我就不再启动一个了。这个指令有个问题,当你关闭当前终端,它就会退出,并不是持久化运行。
关于后台页面blog-cms:
你同样可以这么操作:
npm install
npm install cors
npm install path
npm run build
nohup node server.js &
如果你们碰到Exit报错,可以cat nohup.out看一下,然后问问gpt.
对了如果npm build 没错而运行server.js报错可以考虑运行以下代码进行修复:
npm install cors ##我后来加入了cors来防止一些跨节点无法访问的情况。
npm install path ##用于刷新页面后重定向到页面。
rm -rf dist/
npm run build ## 每次修改代码,增加东西最好都build一下。build前记得删除dist/
2.blog-api的build和运行:
mvn clean install
mvn package
nohup java -jar target/blog-api-0.0.1.jar > output.log 2>&1 &
这个时候你去访问ip:8079 应该就可以看到自己的博客了,8080的用户名Admin,密码123456。如果你记得你有导入blog-api下的数据库文件sql。那么你就可以正常使用blog.
大部分的报错是数据库引起的,可能是MYSQL服务没启动,或者root密码配置错误。对了,我给你写了两个注释,会引起乱码。(root #ä¿Â�æŒÂ�root'@'localhost)
cat /www/wwwroot/xnnehang.top/blog-api/target/surefire-reports/*.txt 改成你的路径,看看是不是这个原因。
Step5.开机自启动:
我希望每次reboot的时候可以自动运行这个nblog,而运行的东西太复杂,我考虑将它加入到开机自启动。 这里是centos的演示:
sudo chmod +x /etc/rc.d/rc.local
vim /etc/rc.d/rc.local
把下方所有代码加入到rc.local末行以下:
sudo docker stop redis
sudo docker rm redis
sudo docker run -p 6379:6379 --name redis -v /data/redis/redis.conf:/etc/redis/redis.conf -v /data/redis/data:/data -d redis:5.0.5 redis-server /etc/redis/redis.conf --appendonly yes
sudo service mysql start
source /root/.nvm/nvm.sh
nvm use 14
cd /www/wwwroot/xnnehang.com/blog-view/
nohup node server.js &
cd ../blog-cms
nohup node server.js &
cd ../blog-api
nohup java -jar target/blog-api-0.0.1.jar > /www/wwwroot/xnnehang.com/blog-api/output.log 2>&1 &
cd /www/wwwroot/xnnehang.com/
关于域名和 SSL,即使过去了很久我还是不怎么会反代,下载证书后该放哪里,验证需要哪些文件。这块就 pass 了~(来自九个月后的自己。)