Web - 码厩

#5 HTTP Query 方法

Web HTTP 2026-06-28

Web HTML 2026-06-27

我曾经有过一个实验，将文件编码存储到一个图片中。
没有想到还有人想到将网站内容存入一个 Favicon，然后通过 JS 解析出来，有意思。
虽然想不到什么实际意义，但是是一次有趣的探索实验。

Tim Wehrle 的文章《I Stored a Website in a Favicon》是这样说的：
PS：代码放在 GitHub 上。

编码过程：将 HTML 文本转为 UTF-8 字节数组 → 前置 4 字节记录载荷长度（便于截断尾部无用像素）→ 依次写入 PNG 像素的 R/G/B 通道（每像素存 3 字节），生成的图像看似随机噪点。
```
<style>
    body {
        font-family: system-ui;
        max-width: 40rem;
        margin: 2rem auto;
    }
</style>
<h1>Website in a Favicon</h1>
<p>Everything you're reading right now was decoded from favicon pixels.</p>
```
HTML 载荷：208 字节 + 4 字节长度头 = 212 字节
Favicon 部分：选择 9×9 正方形，81 像素，可以容纳 239 字节数据，Cover 上面的 HTML 负载（利用率约 87%）
解码过程：浏览器加载 favicon → 用 Canvas API 绘制并读取像素 RGB 值 → 还原字节数组 → 读取前 4 字节获知长度 → 提取载荷 → UTF-8 解码得到原 HTML → 替换页面内容渲染。
关键限制：favicon 只存内容，仍需一小段外部 JavaScript（bootstrap loader）来解码，无 JS 时它只是一张普通 PNG。

Web 2026-06-24

该博客 码厩（markjour.com） 是一个全静态的站点，部署在阿里云的虚拟主机上。
静态网站最大的优点就是省心，完全不需要什么维护工作，写完文章（Markdown 格式）之后编译（HTML 格式）、上传即可，这个过程是通过自己开发的一个 Python 工具实现的。

但是最近几个月遇到了一个比较头疼的问题：几乎每到月底，最后几天网站无法访问，阿里云那边说是本月流量已超出限制。
以前几年一直没遇到过，流量也没有明显变化，不知道是不是最近调整了统计规则。总之，隔三差五地无法访问就很糟糕。

今天抽空处理一下，我想着将网站使用的一些公共资源 —— 如 Bootstrap、jQuery、Font Awesome 等 —— 都采用前端公共资源 CDN，应该就好了。

PS：其实一开始是采用了前端公共资源 CDN 的，只是因为之前选的那些 CDN 用不了多久就关门了，所以就拿掉了。现在又出现这个问题，没有办法，只好重新采用 CDN 的方案。

Web HTML 2026-06-23

页面上加链接可以点击触发拨号 <a href="tel:+8613800138000">138****8000</a>，这个各浏览器都支持。

不同的是，iOS Safari 自动识别电话号码并注入拨号连接，而 Android Chrome 则没有这个行为。

在 iOS Safari 会自动扫描页面中的数字串（比如订单号、序列号、IP 地址），只要格式“看起来像电话”，就会偷偷把它们转换成可点击的拨号链接：

<a href="tel:1234567890">1234567890</a>

这会导致样式错乱，甚至误触拨号。

解决方案：

全局关闭自动识别：
```
<meta name="format-detection" content="telephone=no" />
```
注意：这是 Apple 私有的规范，并非 W3C 标准。

真正需要拨号的地方，手动声明：

<a href="tel:+8613800138000">138****8000</a>

Web JavaScript 2015-01-30