基于UptimeAPI的网站监测搭建教程(Build)
基于UptimeAPI的网站监测搭建教程(Build)
Moyu's Blog

基于UptimeAPI的网站监测搭建教程(Build)

Moyunium
2025-07-11 发布 / 正在检测是否收录...

前の戏

相信各位站长都有自己的网站吧!!

那么,想必这个网站监测是十分中肯的!(和松纸宝宝同款哦~)

松宝宝の监测:https://uptime.song3060.top

?????????

Warning :本期难度极大!!!请无关人员迅速离场!!!

Warning :本期难度极大!!!请无关人员迅速离场!!!

Warning :本期难度极大!!!请无关人员迅速离场!!!

Warning :本期难度极大!!!请无关人员迅速离场!!!

Warning :本期难度极大!!!请无关人员迅速离场!!!

?????????

Preparations Part 1

  1. 聪慧的大脑
  2. 一台微软视窗电脑(手机termux构建性能太差,不建议)
  3. 因特网络连接
  4. 若必需,请自行准备代の理

Preparations Part 2

Links

请注册UptimeRobot账号:UptimeRobot Dashboard (可能需要代の理)

请注册EO账号:https://console.tencentcloud.com/edgeone/zones (支持中文)

源码基于vue,原始仓库地址为:https://github.com/JLinmr/Uptime-Status(可能需要代の理或镜像站)

不要忘了给开发者Star支持

Step 1

按照上方所诉,注册UR账号并来到API页面,并复制Read-Only key备用**:**

(?请勿使用Main key,这可能造成你的隐私泄露或滥用)

(?请勿使用Main key,这可能造成你的隐私泄露或滥用)

(?请勿使用Main key,这可能造成你的隐私泄露或滥用)

Step 2

访问GITHUB仓库,下载源码(本期为本地Build基础版教程,至于托管请自便!!!)

请解压保存源码项目文件夹!!!

Step 3

按照GIF所示,找到你解压的文件夹,打开cmd

不会就多看几遍!

请保留打开的CMD窗口,现在我们要下载?Node.js?

官网:https://nodejs.org/

下载链接直达Node.js (64)

下载链接直达Node.js (32)

只需要一直点next就OK了,因为我的环?境特殊,就不演示了

Step 4

回到刚刚的CMD窗口,先检查node是否安装好,请执行:

npm

出现类似页面就说明装好了,没装好的话返回Step 3?

现在,执行如下代码来安装依赖包:?

pnpm install

第一次安装会从网络下载,请耐心等候,出现如下页面则表示安装成功:??

(出现Warning可忽略)

Step 5

???祝贺你!!!你已经超过90%的同学了!!!???

接下来,请到你的源码项目文件夹,修改.env的内容:

返回到CMD窗口运行以下命令:

pnpm build

看到有绿字表示构建完成,此时项目文件夹中会出现一个/dist文件夹,我们先放一边

Step 6

欧克,现在我们就可以开始部署了

部署平台有很多,比如EdgeOne Pages,Cloudflare Workers,Vercel,Netfily,Github

这里我推荐新手使用EdgeOne Pages,免费而且速度快支持中文,其他平台可以咨询我???

登录后台 EO(国际站)

如图所示点击创建项目------->直接上传,接着上传/dist文件夹(注意是文件夹!!!)

上传完成后大概会是这样,点击”预览“就可以看看有没有问题

至于绑定自己的域名只需要点击“项目设置”就能看到了,添加CNAME即可

END

本期难度远超往期,重点考察同学们对常用工具的熟练度,以及命令行的常规技巧,综合性较强。

评论区可以交作业!???

© 版权声明
THE END
喜欢就支持一下吧
点赞 0 分享 收藏

评论 (0)

取消