GXNAS博客

  • 博客会员
    • 注册会员
    • 重置密码
  • 博客文章分类
    • NAS
    • 虚拟化技术
    • 路由器
    • 网站
    • Linux
    • Windows
    • IPTV
    • 游戏
    • 资源下载
    • 其他
  • ”零刻迷你主机“玩机教程
    • 零刻EQ12迷你小主机评测
    • 零刻SER5 5500U打造新潮派HTPC
    • 零刻SEi10玩ESXI+群晖NAS+Ubuntu
    • 零刻EQ13化身迷你静音省电的NAS
    • 零刻EQ13部署双软路由教程
    • 零刻ME Mini搭建群晖NAS教程
  • 阿里云盘资源
    • 阿里云盘资源更新日志
    • 阿里云盘资源分享
    • 阿里云盘扩容福利码
  • 【GXNAS网盘】
  • 【GXNAS小工具】
    • 免费AI绘图
    • 五子棋小游戏
  • 请博主喝奶茶
GXNAS博客
https://wp.gxnas.com
  1. 首页
  2. 网站
  3. 博文内容

在CloudFlare免费搭建导航页的教程【仅限本站会员回复后查看】

发布时间:2025年6月7日 1365次浏览 3人点赞 32条评论

【简介】

       Cloudflare是一家提供CDN、网络安全、DDos防御和域名服务的美国公司,简称“CF”。CF的 Worker 是 Cloudflare 提供的一个服务器less(无服务器)计算服务,我们编写一段代码(可以是Javascript、Typescript、Python等),把代码上传到worker上就可以部署到 Cloudflare 在全世界的 CDN 服务器节点上。 每当有访客请求worker地址时,距离访问者地理位置最近的CDN节点就会相应请求执行这段代码。

       CF真是个大善人,浑身都是宝,这次我们就来白嫖一下他家的 Worker 服务搭建一个导航页,好处就是你不需要购买VPS、服务器不用你维护、域名自带SSL证书、证书到期自动续约、域名可以免端口访问。

 

【前提条件】

※一个CloudFlare账号(如果还没账号的,请自行注册)

※一个托管在CloudFlare的域名

 

【操作步骤】

1、在浏览器打开【CloudFlare官方网站】,登录你的账号,点菜单上的“计算(Workers)”——“Workers和Pages”,再点“创建”;

 

 

2、找到“从Hello World!开始”,点“开始使用”;

 

 

3、这里随便起个名称,部署;

 

 

4、当看到显示“成功!您的项目已经部署到以下区域:全球”时,点“编辑代码”;

 

 

5、把worker.js里面的代码全部删除;

 

 

6、在下方链接点右键“另存为”下载到电脑上(不建议直接点开链接复制,否则代码里面的中文会显示乱码),用Notepad编辑器打开,复制全部代码(根据自己实际情况修改,具体看第14个步骤),到CF的worker.js里面粘贴(粘贴代码之前一定要先删除原有的内容),点“部署”;

温馨提示:此处内容已隐藏,需要在本文 发表评论 后,重新刷新页面即可查看!

 

 

 

7、看到显示“版本已保存”的时候,点返回键返回;

 

 

8、由于CF家Worker分配的域名在国内无法访问,因此需要绑定自己的域名才能访问,点:设置,域和路由,添加;

 

 

9、自定义域;

 

 

10、输入你要使用的域名,添加域;

 

 

10、变量和机密,添加;

 

 

11、变量名称写“NAV_LINKS”(这里是区分大小写的,不要写错),在“值”里面填写你要显示的导航页名称和链接(名称和链接的中间用英文小写状态的逗号间隔,每个链接单独一行,例如以下格式),再点“部署”:

群晖官网,https://www.synology.cn
GXNAS博客,https://wp.gxnas.com
GXNAS网盘,https://d.gxnas.com
我的NAS,https://192.168.1.100:5001
我的EMBY,http://192.168.1.100:8096

 

 

 

 

 

12、可以打开【这里】,查看显示的效果;

 

 

13、目前导航页实现的功能有:

✅ 详细天气(访问者所在城市、当前气温、体感温度、当前湿度、当前风速、未来 3 天天气)
✅ 白天/夜间模式切换
✅ 当前时间实时显示(24小时制)
✅ 导航链接以卡片式展示(PC/手机均可自适应)

 

14、可自定义的“个性化内容”在:
※浏览器标题栏内容在源代码第53行修改
※导航页头部内容在第207行修改
※页脚版权声明在第214行修改

 

15、博主并不懂编程,本教程使用的代码让AI帮我写的,如果你会编程,可在原基础上完善代码。

标签: CloudFlare NAS 导航页
最后更新:2025年7月13日

本文作者:博主

个人简介:(未填写)

打赏 点赞
< 上一篇
下一篇 >

文章评论

  • 一叶孤帆

    过来学习学习!

    2025年7月15日
    登录以回复
  • 上一页
    您需要 登录 之后才可以评论
    站内搜索
    分类
    • IPTV / 15篇
    • Linux / 34篇
    • NAS / 252篇
    • Windows / 21篇
    • 其他 / 37篇
    • 游戏 / 3篇
    • 网站 / 125篇
    • 虚拟化技术 / 55篇
    • 资源下载 / 2篇
    • 路由器 / 46篇
    归档
    博客统计信息
    • 4,909,365
    • 570
    • 16,784
    • 2025年7月8日

    © 2025 GXNAS博客 版权所有,未经许可不得转载或引用本站的内容。

    COPYRIGHT ALL RIGHTS RESERVED.

    网站备案号:桂ICP备18008717号