个人博客搭建全记录02-项目部署上线

个人博客搭建全记录02-项目部署上线
SEAlencehe因为笔者需要使用图床及其他云服务,为了方便,所以没有采用 github page 直接使用云服务器。
一、购买云服务器
最近腾讯云和阿里云都在年终促销,经过对比,笔者参加新用户活动选择了腾讯云
二、购买域名
这没什么好说的,找到自己喜欢的便宜的就行
三、创建图床
为了方便后期更新博客,在 Typora 中插入的图片能动态的更新资源地址,这里使用青花鱼的方案
1.创建腾讯云 COS 存储桶
2.设置参数
3.创建完成
4.创建 SecretId 和 SecretKey
为了安全,建议使用子账户创建
5.Typora 安装 PicGO 插件
文件 ➡ 偏好设置 ➡ 图像 ➡ 插入图片时:上传图片 ➡ 上传服务设定 ➡PicGo-Core(command line)➡ 下载或更新 ➡ 打开配置文件
6.配置 PicGo
{
'picBed':
{
'uploader': 'tcyun',
'tcyun':
{
'secretId': '你的腾讯云SecretId',
'secretKey': '你的腾讯云SecretKey',
'bucket': '腾讯云COS存储桶名称',
'appId': '腾讯云COS存储桶数字Id',
'area': '腾讯云COS存储桶区域',
'path': '上传路径',
'customUrl': '',
'version': 'v5',
},
},
'picgoPlugins': {},
}
7.创建腾讯云 COS 存储桶路径
点击验证图片上传选项,出现如下信息表示成功
存储桶也出现了上传的图片文件
四、云服务器配置
1.创建 ssh 密钥
创建完成后会东到哪个下载密钥文件
绑定实例
2.远程链接
这里笔者使用的是 FinalShell 进行链接
2.1 新建 shh 链接
主机就是云服务服务器的公网 ipv4 地址
2.2 添加密钥
浏览 ➡ 导入 ➡ 浏览 ➡ 选择在腾讯云下载的密钥文件ssh.pem
密码不用管
2.3 链接
出现如下信息说明链接成功
五、项目部署
因为本博客是持续更新,同时云服务器已经预装了宝塔面板,所以采用使用 Git Webhook + 宝塔面板的 Webhook 功能自动化部署的方案
1.安装 Webhook 和 node
因为云服务器已经预装了宝塔面板,所以傻瓜式的直接安装
2.准备项目
首次需要手动拉取项目
# 进入网站目录
cd /www/wwwroot
# 克隆你的项目(替换为你的 Git 仓库地址)
git clone https://github.com/your-username/your-repo.git your-domain.com
# 进入项目目录
cd your-domain.com
# 安装依赖
npm i
3.配置 Webhook 脚本
添加 hook
PROJECT_PATH="/www/wwwroot/my_blog"
WEB_ROOT="/www/wwwroot/my_blog/index_html"
cd $PROJECT_PATH
# 拉取最新代码
git pull origin master
# 安装依赖(如果需要)
npm i
# 清理并生成
hexo clean
hexo generate
# 复制到网站根目录
if [ -d "public" ] && [ -d "$WEB_ROOT" ]; then
cp -r public/* $WEB_ROOT/
echo "部署完成"
else
echo "部署失败:public 或网站根目录不存在"
exit 1
fi
复制生成的地址
到仓库设置 hook
点击 管理 → WebHooks → 添加 WebHook
配置:
- URL: 粘贴宝塔 Webhook 地址
- 触发事件: 选择
Push - 点击 添加
配置:
- URL: 粘贴宝塔 Webhook 地址
- 触发事件: 选择
Push - 点击 添加
这样远程仓库收到推送就会通知宝塔执行部署脚本,实现博客的更新
4.添加 DNS
在控制台给自己的域名添加云解析,这样才能使用域名访问到服务器
记录值即为服务器
访问域名,出现备案页面,说明解析成功,备案过程不再赘述
5.宝塔创建网站
网站 ➡HTML 项目 ➡ 添加项目
绑定域名就是已经购买的域名,也可以增加服务器的 ip 地址
根目录就是项目打包的根目录
6.测试
直接打开服务器的 ip 地址,可以发现博客已经成功加载出来了
评论
匿名评论隐私政策
✅ 你无需删除空行,直接评论以获取最佳展示效果

























.png)




