type
Post
status
Published
date
Feb 5, 2026
slug
webstack-1
summary
几百个链接堆在那里，那是“书签”吗？那是互联网坟墓。
tags
开发
建站
category
技术分享
icon
password
说实话，我的 Chrome 书签栏早就没法看了。
几百个链接堆在那里，那是“书签”吗？那是互联网坟墓。每次想找个文档或者工具，都得在那堆密密麻麻的文字里翻半天。
我又是个颜控，市面上的导航站要么广告满天飞，要么审美停留在 2005 年。
需求很明确：
- 纯静态：我不想维护数据库，也不想买服务器，白嫖 GitHub Pages + Cloudflare 才是王道。
- 颜值高：看着得舒服，毕竟是浏览器的“起始页”。
- 易维护：最好改改文本文件就能更新，别搞复杂的后台。
于是，我锁定了 GitHub 上最火的方案：WebStack-Hugo。
🛠️ 从 0 开始搭建
搭建过程其实很顺滑（感谢开源大佬）。
本地装好 Hugo，把主题拉下来，简单改改
config.toml，一个像模像样的导航站雏形就出来了。WebStack 最让我爽的一点是，它的数据结构非常清晰。你不需要写 HTML，只需要在一个
webstack.yml 文件里填空就行：YAML
这看起来简直完美，对吧？
但是（凡事就怕但是），当我准备把我的几百个收藏夹搬进去的时候，噩梦开始了。
🤯 被图标支配的恐惧
配置项里的
logo: ??? 成了我最大的拦路虎。为了给这几百个网站配上图标，我经历了三个阶段的折磨：阶段一：手动下载（累死人版）
最开始，我老老实实地打开每个网站，右键另存为 favicon，然后改名，放到项目的
static/assets/logos/ 目录里。后果：
- 搞了 20 个我就不想干了。
- 有的网站图标是高清 PNG，有的是模糊的 ICO，大小不一。
- 项目体积蹭蹭往上涨，Git 仓库里全是乱七八糟的图片。
阶段二：在线图床（由于众所周知的原因...）
后来我想偷懒，去网上找现成的图标 API，或者直接用
jsdelivr 这种 CDN 链接。YAML
后果：
- 浏览器疯狂报警：
Tracking Prevention blocked...，看着那黄色的警告条我就难受。
- 不稳定：今天这个 CDN 挂了，明天那个图床被墙了。打开我的导航站，经常是一片红色的“图片裂开”图标。
阶段三：Google API（404 地狱）
听说 Google 有个神接口
google.com/s2/favicons，能自动抓取。我试了一下，确实高清！后果：
- 超时：在国内网络环境下，这个接口基本是半身不遂的状态。
- 404：对于很多小众域名（比如我自己部署的服务），Google 根本没收录，直接返回 404 错误。
🛑 陷入僵局
现在的局面是：
- 用本地图片？太累，难维护，体积大。
- 用在线接口？太慢，甚至直接红一片。
每次打开浏览器控制台（F12），看着满屏红色的
ERR_CONNECTION_TIMED_OUT 和 404 Not Found，我的强迫症都要犯了。我需要一个方案：
既能像 Google 那样全自动抓取（不用我存本地文件），又能在国内秒开，还得永不报错。
有没有这种黑科技？
有的。既然我的域名在 Cloudflare 上，为什么不让 CF 的边缘节点帮我去“跑腿”呢？
下集预告：
我决定自己动手写代码！下一篇，我们将用 Python 暴力清理之前下载的垃圾文件，并开始探索 Cloudflare Workers 的骚操作。
(未完待续)
- 作者:Leisurelywolf
- 链接:https://blog.869669.xyz//technology/webstack-1
- 声明:本文采用 CC BY-NC-SA 4.0 许可协议，转载请注明出处。
相关文章
