Chrome on 小盒子的技术分享

Postman 越来越臃肿了，我换了个开源的，还能让 AI 帮我写测试

Mon, 13 Apr 2026 03:56:46 +0000

Postman 我用了好几年了。

从最早的 Chrome 插件时代开始用的，那时候它还是个轻量小工具，打开就能测接口，干干净净。但最近这两年，怎么说呢，它开始「端着」了。

打开就让我登录。不登录不让用。

好不容易登录了，又弹窗让我升级 Team 版。

集合还给我存到云端去了。我就测个本地接口，你把我的请求数据往你服务器上传干嘛？

我一直忍着，直到有一天，团队里两个人同时改了同一个集合，Postman 云同步直接给合并冲突了，还没法像 Git 那样 diff 看变更。那天我就想，不行了，得换。

然后我遇到了 Bruno。

怎么形容呢，就像你一直在用一个越来越臃肿的 IDE，突然有人递给你一个 Vim，告诉你「够用了，而且是你的」。

Bruno 干了一件特别简单但特别对的事情，它把你的 API 请求存成 .bru 文件，放在你本地文件夹里。

就是普通的文本文件，打开长这样。

1meta { name: 用户登录 type: http seq: 1}post { url: {{baseUrl}}/auth/login body: json auth: none}headers { Content-Type: application/json}body:json { { "username": "{{username}}", "password": "{{password}}", "expiresInMins": 30 }}script:post-response { if (res.status === 200) { bru.setVar("authToken", res.body.accessToken); bru.setVar("userId", res.body.id); }}tests { test("登录应该返回 200", function() { expect(res.status).to.equal(200); }); test("响应中应该包含 accessToken", function() { expect(res.body.accessToken).to.be.a("string"); expect(res.body.accessToken.length).to.be.greaterThan(0); }); test("响应中应该包含用户基本信息", function() { expect(res.body.id).to.be.a("number"); expect(res.body.username).to.equal("emilys"); expect(res.body.email).to.be.a("string"); }); test("响应时间应该小于 3 秒", function() { expect(res.responseTime).to.be.lessThan(3000); });}

你看，GET 请求、Header、Body、断言，全都是纯文本。你用任何编辑器都能打开它，改完保存就行。

这玩意最不同的地方在哪？

它可以用 Git 管理。

以前团队共享 Postman 集合，那叫一个痛苦。谁改了什么不知道，版本对不对不确定，冲突了还没法 resolve。

现在用 Bruno，接口定义就是文件，扔进 Git 仓库，该 PR 就 PR，该 Code Review 就 Code Review。有人改了某个接口的 Header，diff 里看得一清二楚。

用程序员已经会的工具，解决程序员的问题。不用学新的协作方式，不用付费，不用担心数据被传到哪个云上。

Bruno 官网上有一句话我印象特别深，大意是**「我们不会同步你的任何数据到云端，甚至连登录的概念都没有。我们看不到你在 Bruno 里输入了什么，也不会用你的数据训练任何 AI 模型」。**

在这个年代，一个工具敢这么说，我觉得还是挺硬气的。

回到工具本身。说到这里，可能有朋友会想，开源 API 客户端一抓一大把，Insomnia、Hoppscotch、Thunder Client，凭什么是 Bruno？

我自己用下来，让我有「这玩意不一样」的瞬间，是发现它有 CLI。

但我说的不是「能在终端里跑测试」这种废话。Newman 也能跑，Postman 自己也有命令行。我说的是另一件事。

Bruno 的 CLI，让 Claude Code 和 Cursor 这种 AI 编程工具，第一次能真正帮你写和跑接口测试。

这话有点大，我用两件刚发生的真事讲一下。

回到 Bruno 的 CLI 本身。装它就一行，

1npm i -g @usebruno/cli

装完之后命令叫 bru，跑整个集合的测试是这样，

1bru run --env production

输出长这样。

干净、彩色、有 ✓ 和 ✗、有总耗时、有失败原因。最重要的是，这是一段普通的终端命令，输出是普通的文本。

为什么这件事重要？因为这两个特征，正好是 AI 编程 agent 工作的边界。

Claude Code、Cursor、Codex 这些工具，它们能干什么？它们能读你的代码文件，能写新的文件，能在终端里跑命令，能读命令的输出。它们不能干什么？它们不能点击 Postman 的按钮，不能在你 GUI 里输入 token，不能登录任何账号。(或者说不方便，成本高，效率低)

Postman 的核心数据存在云端、操作靠 GUI、协作靠登录，这三件事每一件都把 AI agent 挡在外面。

而 Bruno 的核心数据是 .bru 文本文件、操作靠 CLI、协作靠 Git。每一件都正好是 AI 最擅长的那种事。

抽象的说完了，说点具体的。

我前两天就让 Claude Code 帮我加了一个测试，过程是这样的。

我跟它说，「我刚加了一个搜索商品的接口，帮我在 bruno 集合里加个测试用例」。

它干了三件事，全程没问我任何问题。

第一步，读了我现有的一个 .bru 文件，就是为了搞清楚我用的格式。比如我习惯加哪些 test，断言风格是什么样的。

第二步，照着这个格式写了一个新的 06-搜索商品.bru 文件，放在我集合的根目录里。请求方法、URL、query 参数、4 条断言，全都给我加上了。

第三步，它直接执行 bru run 06-搜索商品.bru --env production，亲眼看着 4 个测试全绿，然后才回我一句「写完了，4/4 通过」。

整个过程我没碰 Bruno 的 GUI，没敲一个字符的代码，没解释什么是 .bru 格式。AI 自己读自己写自己跑自己验证。

你可能会问，这个事换成 Postman 不行吗？

我得先把话说清楚，Postman 不是没有 CLI。Newman 一直都在，Postman Collection 也是 JSON 文件，AI 理论上能读能写。这条路是通的。

但你真去试一下就会发现，那条路上全是石头。

Postman 的 Collection JSON 格式不是给人手写的。我做了个最朴素的对比，同一个 GET 请求加一条「状态码等于 200」的断言，写成 .bru 是 15 行，导出成 Postman Collection JSON 是 44 行。区别在哪？.bru 里 URL 就是一个字符串 https://api.example.com/users，Postman JSON 里 URL 被拆成 protocol、host 数组、path 数组三个字段。.bru 里测试代码就是普通 JS，Postman JSON 里测试代码以字符串数组的形式塞在 event 里，每一行 JS 都得加引号、转义、再 JSON 序列化一次。还有一堆 _postman_id、_exporter_id、schema 这种内部元数据，跟你的业务接口毫无关系，但你不写就报错。

让 AI 写 .bru，它跟写 markdown 一样轻松。让 AI 写 Postman JSON，它更像在翻译一份配置文件，token 烧得多，出错概率高，写完你自己 review 都费劲，git diff 出来三行业务变更夹在二十行格式噪音里。

所以不是 AI 不能写 Postman 的测试，是 Postman 的格式从一开始就没打算让人手写，更没打算让 AI 直接读写。它假设你有一个 GUI 在中间帮你管理这些内部细节。AI 进来之后，那个假设就有点尴尬了。

我说的还不是最炸的场景。

真正让我觉得 Bruno + AI 是 1 + 1 大于 10 的，是调试场景。

我又试了一次，让 Claude Code 帮我加一个购物车接口的测试。它写完跑了一遍，挂了。

错误信息是这样的。

 1✕ 购物车应该有 totalPrice 字段 expected undefined to be a number✕ 购物车应该有 products 数组 expected undefined to be an array
 2
 3```bash
 4
 5它猜错了字段名。这种事很正常，毕竟它没真的去看接口返回。但接下来才有意思。
 6
 7它没有问我、没有让我提供文档、也没有放弃。它自己执行了一条 curl 命令，把购物车接口的真实响应拉了下来。
 8
 9```bash
10curl -s https://dummyjson.com/carts/1

看到响应里字段是 total 和 products，不是 totalPrice 和 items。它马上把测试里的字段名改了，再跑一遍，全绿。

整个调试过程，我做了什么？我什么也没做。我只是看着它一步一步跑完。

这就是 Bruno + CLI + AI 的真正价值。你的 API 测试不再是一个孤立的、需要你手动维护的负担，而是变成了 AI 可以读、可以写、可以跑、可以调试的一种代码。

它和你的源码、你的 Git 历史、你的 CI/CD、你的 AI agent，全都是一体的。

写到这里我猜有人要拍桌子了。

「等等，国内程序员谁还用 Postman 啊？Apifox 它不香吗？」

发，我们专门聊聊 Apifox。

我必须先承认它真的很强。一体化平台，API 文档、调试、Mock、自动化测试、团队协作全在一个工具里搞定，相当于 Postman + Swagger + JMeter 三合一。界面是中文，文档是中文，国内团队几乎零学习成本。如果你的团队 20 人以上，需要权限管理、需要实时协作、需要统一的 API 文档管理，Apifox 是比 Bruno 更合适的选择。这点我不否认。

而且 Apifox 不傻，它也在跟上 AI 浪潮。它有 apifox-cli，能在终端里跑测试场景。它甚至专门做了 Apifox MCP Server，可以让 Cursor 和 Claude Desktop 读取 Apifox 项目里的 API 文档，帮你写代码。

那问题来了，Bruno 和 Apifox 在 AI 这件事上到底有啥不一样？

我读了一圈 Apifox 的官方文档，发现一个挺有意思的差别。

Apifox 接 AI 的方式，是让 AI 来连接 Apifox。Bruno 接 AI 的方式，是 Bruno 根本就是 AI 已经会读的格式。

具体说，Apifox 的 AI 工作流是这样的，你的测试数据躺在 Apifox 云端项目里，你装一个 Apifox MCP Server，配置 Cursor 去连这个 MCP，AI 通过 MCP 协议向 Apifox 服务发请求，把 API 文档拿下来，再帮你生成代码。

Bruno 的 AI 工作流是这样的，你的测试就是项目目录里的 .bru 文件，AI 直接 cat、edit、bru run。完了。

你看出区别了吗？Apifox 把 AI 当成一个外部工具来对接，所以需要 MCP 这一层中转。而 Bruno 根本不需要 MCP，因为它跟 AI 用的是同一种原生语言：文本文件加终端命令。

还有一个更现实的差别。Apifox 的 MCP Server 现在的能力，是让 AI 读取 API 文档来生成代码，它并不能让 AI 直接去编辑你的测试用例。AI 在 Apifox 这边的角色基本上是只读的。

而我前面演示的那两个场景，Claude Code 帮我写新测试、自动调试、修字段名，那是完整的读写跑改循环。AI 不光在读，还在写，还在跑，还在调试。这是因为 .bru 是普通文件，Edit 工具就能改，Bash 工具就能跑。它中间没有任何一层，所以也没有任何一层会卡住。

这不是说 Apifox 不好，是两条不同的路。Apifox 选的是「我是平台，AI 来连我」，Bruno 选的是「我什么都不是，我就是文件」。前者适合企业级场景，后者适合代码即测试的开发者工作流。

我自己是后者。我喜欢我所有的东西都能塞进 Git 仓库，喜欢 AI 直接读我硬盘上的文件，不喜欢任何账号、登录、云端中转。所以我选 Bruno。

如果你的工作场景更接近企业级 SaaS 那一套，那 Apifox 完全没问题，甚至更合适。但如果你跟我一样，希望让 AI 一句话把接口测试搞定，那 Bruno 这条路确实更顺。

聊完 Apifox 我们继续。顺便提一下 CI 集成，因为这块也很丝滑。Bruno CLI 支持输出 JUnit XML，GitHub Actions、GitLab CI、Jenkins 直接吃这个格式。我的工作流文件大概长这样。

1- name: 安装 Bruno CLI run: npm install -g @usebruno/cli- name: 跑接口测试 run: bru run --env production --reporter-junit junit.xml

两步。你的 PR 一提交，所有接口测试自动跑一遍，挂了直接拒绝合并。

生成的测试执行也挺好看的

整套东西免费、开源、本地、Git 友好、AI 友好，不用登录、不用付钱、不用担心数据上云。

安装很简单。桌面版，

1brew install bruno
2
3```bash
4
5CLI，
6
7```bash
8npm i -g @usebruno/cli

用了一周之后我把 Postman 卸了。

不是它不好，是我不再需要一个登录才能用、集合存在别人云上、免费版各种限制、AI 完全帮不上忙的接口测试工具了。

我只需要一个文件夹、几个 .bru 文件、一条终端命令，和一个能读懂这一切的 AI。

有时候工具的进步不是功能越加越多，而是把不该有的东西去掉。Bruno 去掉了登录、去掉了云端、去掉了 GUI 锁定，剩下的全是程序员真正需要的东西。

而当你把这些不需要的东西去掉之后，你会发现一个意外的副作用，AI 进来了。

好了就说这么多。

如果你也受够了 Postman，试试 Bruno。说不定你也会像我一样，用完就回不去了。

ps:我写的 demo 在这里，你可以拉下来试一下，可以 run 的：https://github.com/xiaobox/bruno-demo

如何在 mac 的 chrome 中开启 gemini 侧边栏

Sat, 31 Jan 2026 02:03:30 +0000

昨天折腾了半天，厕所都没上，没搞定，今天一分钟搞定了，其实非常简单。

前提条件什么的自不用说，主要是两步，我是 mac 系统，windows 的不知道。

第一步

把语言设置一下，注意是在操作系统中设置chrome 的自定义语言

第二步

打开终端，输入以后命令后回车

⚡ 代码片段open -n -a "Google Chrome" --args --variations-override-country=us

也可以用这个项目设置一下：https://github.com/lcandy2/enable-chrome-ai

然后重启 chrome 就可以了，location 如果不支持，你应该知道怎么办吧，哈哈。

无损图像格式比较：PNG、WebP、AVIF 和 JPEG XL

Mon, 22 Jul 2024 06:17:58 +0000

在数字时代，图像质量和压缩效率成为了关键问题。本文对比了四种主流的无损图像格式：PNG、WebP、AVIF 和 JPEG XL，探讨它们在压缩效率、编码速度和使用场景等方面的优劣。

什么是无损压缩？

无损压缩是一种在不损失任何数据的情况下减少文件大小的方法。常见的无损压缩格式包括 ZIP 和 RAR。在 Web 环境中，GZIP 压缩通常用于缩小 JavaScript 和 CSS 文件。在图像压缩领域，PNG 是一种广为人知的无损格式。

无损压缩的替代方法是有损压缩，在压缩照片时经常使用。JPEG 可能是最著名的有损图像格式。有损压缩会丢弃图像中的一些细节，从而导致文件大小显著减小。由于大照片太大而无法传输和存储，因此损失一些质量通常是一个很好的权衡。

何时使用无损压缩？

虽然像 JPEG 和 WebP 这样的有损图像格式对照片来说很好，但对图形来说就不那么好了。压缩失真（如块效应和模糊）在这类图像上很容易看出来。

无损图像压缩在处理包含大量连续颜色区域的图像时效果最佳，比如标志、截图、图表和图形。这类图像用无损压缩算法压缩往往能得到更小的文件大小，同时保持高质量。

无损压缩效果良好的图像示例。PNG 形式的回收符号占用 3 KB。相同文件大小的 JPEG 具有明显的压缩失真。具有最高质量的 JPEG 看起来与 PNG 相同，但大小是 PNG 的八倍。

PNG

PNG （Portable Network Graphics）即便携式网络图形。

是一种老牌的无损图像格式，于1996年首次发布。它作为 GIF 格式的替代品出现，具有许多优势，如支持 24 位颜色和透明通道。PNG 使用 DEFLATE 压缩算法，并支持多种压缩优化工具，如 PNGOUT、OptiPNG 和 OxiPNG。

所有浏览器都支持 PNG 格式。

WebP

Google 于 2010 年推出了基于 VP8 视频编解码器的 WebP 作为有损图像格式。2012年发布的WebP 0.3引入了无损模式，与VP8编解码器无关。有损 WebP 仅限于 4:2:0 色度子采样，会丢弃一些颜色信息，而无损 WebP 将保留所有原始图像数据。

直到 2020 年，Apple 的 Safari 浏览器还是唯一抵制 WebP 的浏览器。不过到了 2021 年，所有主要浏览器均支持 WebP。

AVIF

AVIF 代表 AV1 图像文件格式。它是一种新的图像格式，基于 AV1 视频编解码器。它具有许多高级功能，例如支持高位深度和 HDR。该格式支持无损和有损压缩。

最新版本的 Google Chrome 支持 AVIF，并且可以通过使用配置标志在 Firefox 中启用。

JPEG XL JPEGXL

JPEG XL 是一种即将推出的新图像格式。JPEG XL 是通过结合两种现有的图像格式而开发的，即 Google 开发的 Pik 图像格式和 Cloudinary 开发的 FUIF（免费通用图像格式）。

Chrome 和 Firefox 支持 JPEG XL，但默认情况下不启用。必须使用功能标志来启用对该格式的支持。

对比结果

文件大小

编码速度

总结

从测试结果来看，与最优化的 PNG 相比，大多数现代无损图像格式（例如 WebP 和 JPEG XL）在效率上都有很大提高。

png

使用 OxiPNG 优化 PNG 可以使它们稍微小一些，大约 12%，这并不是一个很大的差异。OxiPNG 速度非常快，处理一张图像只需大约 700 毫秒。

将 Zopfli 设置与 OxiPNG 结合使用会使优化速度极其缓慢，平均需要大约 208 秒或三分半钟。与原始 PNG 相比，生成的文件大约小 18%。我不建议使用 Zopfli 压缩，因为它需要花费大量时间并且只能提供稍小的文件。WebP 或 JPEG XL 等较新的格式生成的文件要小得多，而且编码时间只是 Zopfli 的一小部分。

由于 PNG 优化收益如此之小，并且该过程需要如此多的时间，因此如果能够使用更现代的格式，那么优化 PNG 文件可能根本不值得。即使未经优化，PNG 仍然是源图像格式的不错选择，因为它与图像编辑器和内容管理系统等大多数软件兼容。

你可以将原始 PNG 文件转换为更有效的格式，然后再向最终用户显示。对于无法显示现代格式的客户端（例如某些电子邮件客户端和旧浏览器），PNG 也可以是一种有用的后备格式。

webp

WebP 是无损图像的不错选择，因为它在压缩效率方面轻松胜过 PNG，平均图像小 41%。它也得到网络浏览器和其他软件的广泛支持。WebP 文件的编码速度也很快，压缩仅需约 3 秒。

AVIF

不得不说，我对 AVIF 的表现有点失望。虽然有损 AVIF 确实需要很长时间来压缩，但与 JPEG 和 WebP 相比，它具有出色的压缩效果。不幸的是，无损 AVIF 却并非如此。

在无损模式下，编码 AVIF 文件平均需要 30 秒，但与其他竞争格式相比，结果并不好。平均减少约 20%，生成的文件大小与使用 Zopfli 的 OxiPNG 相当，但与 WebP 或 JPEG XL 相比明显更大。使用 AVIF 时，我会坚持使用该格式效果最好的有损压缩。

JPEG XL

JPEG XL 是新近出现的格式，给人留下了深刻的印象。平均文件大小减少约 48%，略优于 WebP。从第 75 个百分位数来看，JPEG XL 比 WebP 具有优势，这意味着 JPEG XL 在处理难以压缩的复杂图像方面做得更好。

然而这个兼容性吧。。。

AI 工具推荐

Sat, 08 Jun 2024 13:15:48 +0000

前言

对话式人工智能工具的使用可以大幅度提高我们的工作效率，本文将介绍一些比较好用的工具，方便大家日常使用。

工具

豆包

豆包- 抖音旗下AI 智能助手 https://www.doubao.com/

手机、PC 端都支持下载

功能完善，国内优秀的对话式人工智能，利用的自研的大模型原名“云雀”

扣子

https://www.coze.cn/ 字节跳动版本的 GPTs ，使用的模型多为国产及开源模型

https://www.coze.com 是扣子的海外版本，模型可选 GPT-4(免费用，还要啥自行车 😀 )

目前只支持 web 访问

智谱清言

https://chatglm.cn/

有 web 、PC、手机客户端

使用国产 GLM-3 GLM-4 模型，可以说是目前除 openAI 的 ChatGPT 外对中文支持最好的大模型。

秘塔 AI

https://metaso.cn

适合对某一领域或话题进行深入分析，可产出完整的分析报告，适合理论研究、论文、文档的编写。

使用的模型为：秘塔科技自研大模型 MetaLLM

kimi

著名的月之暗面 公司的产品 https://kimi.moonshot.cn/

功能强大，可支持较大的上下文和多文件。号称国内最强 AI 工具。支持手机客户端、PC 端使用

所用模型为国产大模型 Kimi，将上下文无损输入长度提升至 200万字，成为国内大模型首次在部分能力上超越海外主流产品的里程碑。

通义千问

https://tongyi.aliyun.com/qianwen/

原来一般，但最新开源的 Qwen2 模型非常强 👍 ，可以一试

“

阿里开源了通义Qwen2模型，可以说是现阶段这个规模最强的开源模型。发布后直接在 Huggingface LLM 开源模型榜单获得第一名，超过了刚发布的 Llama3 和一众开源模型。Qwen2在代表推理能力的代码和数学以及长文本表现尤其突出。推理相关测试及大海捞针测试都取得了很好的成绩。模型概览：Qwen 2 模型组成包括 Qwen2-0.5B、Qwen2-1.5B、Qwen2-7B、Qwen2-57B-A14B和Qwen2-72B。其中Qwen2-57B-A14B为 MoE 模型。模型在中文、英文语料基础上，训练数据中增加了27种语言相关的高质量数据；增大了上下文长度支持，最高达到128K tokens（Qwen2-72B-Instruct）。多个评测基准上的领先表现；代码和数学能力显著提升；

”

perplexity

https://www.perplexity.ai/

中文支持效果一般，可连网

文心一言

百度的产品，从效果上 3.5 版本不及其他中文模型，但早期中文的理解在某些方面比 ChatGPT3.5 强（应该是针对中文进行过更多的训练和模型微调）。4.0 没体验过，因为他居然收费了

还能说什么呢，这很百度 ╮(╯▽╰)╭

Poe

https://poe.com/ AI 套壳工具，可选多家公司的 AI产品

Gemini

需要科学上网，Google 出品的对话式人工智能 https://gemini.google.com/app ，使用的是 Google 自研的 Gemini 模型

Chrome 浏览器升级到最新版本后，可以用 @ 直接与 Gemini 对话

Claude 3

Anthropic 公司的 Claude3 https://claude.ai/

从能力上可以比肩 OpenAI 的 chatGPT，甚至在质量上比 GPT-4 优秀。但收费

ChatGPT

这个我想应该不用说了，都熟

工具对比

整体来看虽然 OpenAI 以及旗下 ChatGPT 仍然是业界标杆，但国产中文大模型越来越强大。国内用户首推以下几款，目前都可以免费使用：

智谱清言
Kimi
通义千问

能解决网络问题的，推荐试试：

Gemini
Coze (国际版)

能解决网络问题且不差钱的，推荐：

ChatGPT-4 ChatGPT-4o
Claude3

总结

目前中文大模型整体都比 ChatGPT3.5 好用了，如果你习惯使用 ChatGPT3.5 的，真的可以试试国产大模型（不必担心网络问题，回答问题的质量更高）

我有罪啊--用了这么多年 mac 不知道访达有标签页

Sun, 18 Feb 2024 02:30:58 +0000

就像使用 Chrome、Safari 浏览器的标签页一样，Mac 电脑中的 Finder(访达) 应用也具有类似的功能。

使用 Mac 电脑好多年了，一直以为 Finder（访达）没有标签页，还在双击打开文件夹，有时候打开的文件夹一多，一通乱找。

我有罪啊，这个功能已经开发出来 10 年了，2013 年的时候就有了，我居然不知道！！！！

使用起来很简单，当你打开一个文件夹后，如果需要再打开另外一个文件夹，只需要在第二个文件夹打开时按住 command +双击 就可以在一开始那个文件夹上打开标签页了。再也不用打开多个文件夹后，一通乱找了。

打开新标签页的快捷键是 command + t ，跟 Chrome 打开新标签页的一样。

如果你真的单独打开了好多文件夹，那么可以一下把它们全部合并在一个窗口中，Finder 提供了这个功能：

每个选项卡的行为就像它自己的 Finder 窗口一样；你可以相应地调整每个选项卡的视图设置，因此一个选项卡可以显示图标视图，另一个选项卡可以显示列表视图。

打开多个选项卡后，你可以通过将文件拖放到选项卡上来将文件从一个选项卡移动到另一个选项卡。该过程的行为就像将文件拖放到文件夹中一样。

Finder 现在还提供全屏模式。因此，如果你有桌面恐惧症，你可以将 Finder 转移到一个充满选项卡的窗口中，并使用 Mission Control 移入和移出该窗口。

Mac 系统的隐藏功能是真多啊！

我以前默认在新窗口中打开所有文件夹。真是旧习难改。当然，如果你使用了类似 Path Finder 这种解决方案，当我没说。。。

我有罪，平常使用的时候不动脑子，人家都开发出来 10 年了。。。

Arc 浏览器史诗级更新，换掉你的 Chrome 吧

Fri, 02 Feb 2024 08:07:38 +0000

今天 Arc 浏览器更新了，在我今天半天的使用体验下来，总结来说就是：我要更换默认浏览器了！！！

下面给大家简单的介绍一下更新的功能。（注意目标只有 mac 用户可以使用，不支持 windows）

Instant Links

Arc Browser 的 Instant Links 功能真是太好用了

它帮我们省去了 中间页 。什么意思呢？

就是说一般你在搜索引擎搜索关键字，然后搜索引擎会在页面上给你一堆链接，然后你点击感兴趣的链接打开相关网页。搜索引擎提供的页面就是 中间页。

而使用 Arc 的 instant Links 功能以后，Arc 会自动分析你要搜索的内容并直接给你打开它认为最佳的网页，省略了 中间页。你想一想，每次你使用浏览器搜索内容的时候如果都能省略一步操作，那么节省了多少时间啊，等于多攒了2年阳寿。

下面这个例子就是直接打开一串视频 “videos of ipad,iphone, macbookpro”

如何用 Mac 电脑自动填充短信验证码

Sun, 15 Oct 2023 09:41:59 +0000

“

提示：以下方法只适用于拥有 Mac电脑+iPhone手机的用户

”

短信验证码是我们在登录网站时经常会使用的一种方式

如果你使用的是移动应用即 APP 那么通过验证码登录的一般情形是：

打开 APP 登录页，输入手机号，点击 “获取验证码”
收到一条短信，打开短信，记住验证码内容，一般是6位左右的数字，然后手动录入到验证码输入框。或者像苹果 iOS 这样的系统可以自动将短信中的验证码在键盘区域提示出来。你只需要再点一下就可以了，很省事儿
点击 “登录” 结束。

虽然在 APP 上操作也要三、四步，不过整个过程还是比较流畅和自然的，尤其是在 iPhone 上。可能最麻烦的点就是在切换到短信的应用，靠脑子记住验证码再切换回 APP 这步了。

然而相对于网页上的 web 应用，在 APP 上的操作体验已经算好的了。来看一下我们平常用电脑打开某网站然后通过验证码登录的情形是怎样的吧：

打开浏览器，打开某网站并跳转到登录页，输入手机号，点击 “获取验证码”
手机上收到一条短信，这时候会慌慌张张的找手机（因为验证码有有效期），然后打开短信，赶快记住验证码。
回到电脑上把刚才记住的验证码手动一个数字一个数字的录入到验证码输入框。有时候还记错了，或者录错了，再回到手机上看几遍。
点击 “登录” 结束。

针对这个流程，给我的体验有几点不爽：

第一两个设备来回切换，一会儿折腾手机，一会儿折腾电脑的，麻烦！
第二就跟让系统“拿捏” 了一样，在等待验证码的这段时间我这两个设备什么都干不了，生怕错过了有效期。慌张！
第三整个操作下来，时间较长，而且由于有设备切换，发生错误的可能性增加了，整个流程花费的时间比在 APP 上长，低效！

总结下来，在手机上的操作还可以，在电脑上的操作我忍受不了，太不方便了！！！

实际上，作为程序员的我，早已不受这种折磨了，因为我有至少两种办法来解决电脑上用短信验证码登录的痛苦。这里再次强调需要 Mac 电脑+iPhone 手机，这是前提。

方法一苹果原生解决方案

如果你的设备都是苹果的，那么它其实是有原生的解决方案的，总结起来就是：

“

短信转发 + Safari浏览器自动回填

”

这个方法分两步，第一步是短信转发，即设置 iPhone 以在 Mac 上获取短信，达到的效果是：当你的 iPhone 手机上收到一条短信后， Mac 电脑上的 “信息” 应用也会同步收到，并在电脑上提示你。

具体的设置也非常简单：

在 iPhone 上，前往“设置”>“信息”。
轻点“短信转发”。【注】如果没有看到“短信转发”，请确保在 iPhone 和 Mac 上通过相同 Apple ID 登录 iMessage 信息。
在设备列表中打开你的 Mac。
如果未使用双重认证，Mac 上会显示六位数字激活码；在 iPhone 上输入这个激活码，然后轻点“允许”。

这样你就完成了第一步，当手机收到短信时，Mac 电脑上也能同步收到了。😁

第二步更简单了，没有任何设置，你只需要用 Safari 浏览器，打开你要登录的网站，然后当手机收到短信后，Safari 会把短信里的验证码自动填充到验证码输入框，无需任何操作。（当然实际过程是因为打开了短信转发，短信先转发到了 Mac 电脑上，才能被 Safari 浏览器获取）

来看一下效果：

已关注

Replay Share Like

观看更多

退出全屏

切换到竖屏全屏**退出全屏

小盒子的技术分享已关注

Share Video

，时长00:13

0/0

00:00/00:13

切换到横屏模式

继续播放

进度条，百分之0

Play

00:00

00:13

倍速

全屏

倍速播放中

0.5倍 0.75倍 1.0倍 1.5倍 2.0倍

超清流畅

Your browser does not support video tags

继续观看

如何用 Mac 电脑自动填充短信验证码

观看更多

转载

如何用 Mac 电脑自动填充短信验证码

小盒子的技术分享已关注

Share点赞Wow

Added to Top StoriesEnter comment

Video Details

方法二短信转发+开源软件

我知道很多同学不喜欢用 Safari ，或者说有更喜欢和习惯使用的浏览器，比如 Chrome,在这种情况下我们就不能用苹果原生大法了，需要结合开源软件来实现之前的效果。也是分两步。第一步和方法一一样，需要把 “短信转发” 设置好，参考上文，这里就不赘述了。

第二步我们需要有个软件能够实现将短信中的验证码解析出来，并自动填到相应的位置上。我找到一个名为 MacCopier 的应用，地址如下：https://github.com/DreamSaddle/MacCopier

如果大家下载 MacCopier 有困难，可以点击文章底部的按钮关注此公众号，私信回复：“MacCopier” ,我会分享给大家。

当然也有其他应用比如需要付费的 2fhey 不差钱的同学可以选择这个。（我差钱，所以我用开源免费的 MacCopier ）

MacCopier 安装好后，需要为其设置完全磁盘访问权限步骤如下：

打开系统偏好设置 > 安全性与隐私
左下角解锁设置后，找到完全磁盘访问权限选项，在右侧列表中找到 MacCopier 将其勾选上即可。
您也可以勾选登录时启动，这将会在下次登录系统时自动运行此应用。
您也可以勾选自动粘贴，这将会在提取出验证码后自动粘贴到系统当前光标处。自动粘贴功能需要您为 MacCopier开启辅助功能权限。

可能有的同学会担心用这种第三方应用会不会有数据安全问题？

应该担心，尤其是涉及敏感信息的应用大家应该有安全意识，不能为了方便不顾信息安全。所以我仔细地看过了 MacCopier 的源码（Rust写的），除了本地的操作外，没有任何网络连接，可以放心用，不会构成安全问题，就是个本机跑的小工具应用而已。

最后我用 Chrome 浏览器演示一下使用了 MacCoier后的效果。

已关注

Replay Share Like

观看更多

退出全屏

切换到竖屏全屏**退出全屏

小盒子的技术分享已关注

Share Video

，时长00:14

0/0

00:00/00:14

切换到横屏模式

继续播放

进度条，百分之0

Play

00:00

00:14

倍速

全屏

倍速播放中

0.5倍 0.75倍 1.0倍 1.5倍 2.0倍

超清流畅

Your browser does not support video tags

继续观看

如何用 Mac 电脑自动填充短信验证码

观看更多

转载

如何用 Mac 电脑自动填充短信验证码

小盒子的技术分享已关注

Share点赞Wow

Added to Top StoriesEnter comment

Video Details

可以看到与方法一的效果是一样的。

总结

无论是使用方法一还是方法二，在 Mac 电脑上都可以实现：短信验证码自动接收+自动解析+自动回填操作

再也不用花心力（尤其是工作忙的时候，记这破玩意只会更烦躁）记验证码了，也不用手忙脚乱地在两个设置间来回切换了。

还在用 Chrome？ Edge 已成为我的主力浏览器

Tue, 16 Aug 2022 07:50:13 +0000

新版的 Edge 浏览器基于 Chromium，这意味着对于 Chrome 的很多功能，Edge 也会如出一辙

Edge 浏览器完全兼容 Chrome 的扩展程序，能够直接通过 Chrome 商店来安装扩展

Edge 还有大量 Chrome 所不具备的出色功能！

可以截整屏的网页

类似这种：这是我截取的全屏图，非常方便

朗读网页

已经很像自然语音了

搞笑地是，如果你选中文朗读者读英文，可以给你表演个 “中式英语”，简直太像了。当然也可以体验一下原味的美式、英式英语和魔性的印度英语，太好玩儿了。

数学求解器

直接截图或者输入公式就能出答案

引文

论文党的福音

阅读模式

一些常规选项

还有 NB 的语法工具，把不同词性用不同颜色标注，把单词给你按音节拆开，还要咋的。学英语太方便了

还有阅读偏好，简直了

你也可以把任何网页强制进入阅读器模式，只需要在地址栏的网址前加上：read:// 即可

PDF

打开 PDF 后可以直接在上面绘制，写字、画画

PDF 的阅读体验也比 chrome 更好

另外，朗读功能可能直接阅读 PDF 文件内容

Edge 浏览器也是一个强大的 PDF 阅读器，甚至本机不需要再下载其他 PDF 软件，直接右击用 Edge 打开即可

账户同步

其实 chrome 挺好的，但你知道正常情况我们用不了，这不是人家 google 的问题，如果你用科学手段搞定了那没问题，可还有广大不能用的小伙伴呢， Edge 的账户同步解决了这个问题，它能用！只要拥有微软账号，可以在任何设备上打开 Edge 同步你的收藏夹和书签了。

原先在 chrome 中的插件在 Edge 照常用，更棒的是，原来 chrome 的插件商店打不开，用 Edge 商店是可以打开并找到相同的插件的。

其他

比如：重复收藏夹自动删除功能，我们总会重复收藏一些网站，这个功能可以帮我们自动删除重复的收藏

Edge 还有其他一些实用功能大家可以自行挖掘

彩蛋

在地址栏输入：edge://surf/

客户端请求的端口号是什么？

Wed, 15 Sep 2021 03:44:01 +0000

我们知道服务器端是要指定和开放端口号的，比如 web 服务 http 请求的 80，https 的 443 端口，都要开放，否则无法请求成功。

我们知道通信是由两端组成的，既然服务器需要指定端口，那么客户端呢？

比方说我用 chrome 浏览器请求 www.baidu.com, 我知道对于百度的服务器肯定开放了 80、443 端口，那么浏览器呢，或者说我的电脑本机用于请求的端口是什么呢？

带着疑问我用 Wireshark 抓包看了一下

可以看到我的浏览器请求源端口是 62412 ，目标端口是 443。

443 我知道，62412 又是为什么？

不知道，于是想了想 TCP 的连接和请求过程，参考这篇文章：

探究！一个数据包在网络中的心路历程

如文章所说：

“

TCP 协议里面会有两个端口，一个是浏览器监听的端口（通常是随机生成的），一个是 Web 服务器监听的端口（HTTP 默认端口号是 80， HTTPS 默认端口号是 443）。

”

浏览器端口随机生成？嗯，可以，但理论依据是什么？谁规定的？怎么规定的，怎么个随机法，不可能乱生成对吧。带着疑问，查到了资料。

https://www.rfc-editor.org/rfc/rfc6335.html

这是 RFC 的其中一份文档。

解释下 RFC（来自维基百科）

“

请求意见稿（英语：Request for Comments，缩写：RFC），又翻译作意见征求，意见请求，请求评论是由互联网工程任务组（IETF）发布的一系列备忘录。文件收集了有关互联网相关信息，以及 UNIX 和互联网社群的软件文件，以编号排定。目前 RFC 文件是由互联网协会（ISOC）赞助发行。

RFC 始于 1969 年，由当时就读加州大学洛杉矶分校（UCLA）的斯蒂芬·克罗克（Stephen D. Crocker）用来记录有关 ARPANET 开发的非正式文档，他是第一份 RFC 文档的撰写者。最终演变为用来记录互联网规范、协议、过程等的标准文件。基本的互联网通信协议都有在 RFC 文件内详细说明。RFC 文件还额外加入许多的论题在标准内，例如对于互联网新开发的协议及发展中所有的记录。

”

RFC-6335 比较长，我们看其中重要的一段

总结一下

所有的端口被划分为三个数字范围

系统端口，也称为众所周知的端口，从 0 到 1023（由 IANA 分配）

“

互联网号码分配局（英语：Internet Assigned Numbers Authority，缩写 IANA），是一家互联网地址指派机构，管理国际互联网中使用的 IP 地址、域名和许多其它参数的机构。IP 地址、自治系统成员以及许多顶级和二级域名分配的日常职责由国际互联网注册中心（IR）和地区注册中心承担。IANA 是由 ICANN 管理的。

”

用户端口，也称为注册端口，从 1024-49151（由 IANA 分配）
动态端口，也称为私有或临时端口，从 49152-65535（从未分配）

在可分配的端口范围（系统端口和用户端口，即端口号 0-49151）中，单个端口号在任何给定时间处于以下三种状态之一：

已分配：已分配的端口号当前已分配给注册表中指示的服务。
未分配：当前可根据请求分配未分配的端口号。
保留：保留端口号不可用于常规分配；它们被“分配给 IANA”用于特殊目的。保留端口号包括每个范围边缘的值，例如 0、1023、1024 等，可用于扩展这些范围或将来的整体端口号空间。

对于动态端口（Dynamic Ports），范围从 49152 到 65535，这些端口号一般不固定分配给某个服务，也就是说许多服务都可以使用这些端口。只要运行的程序向系统提出访问网络的申请，那么系统就可以从这些端口号中分配一个供该程序使用。比如 49152 端口就是分配给第一个向系统发出申请的程序。在关闭程序进程后，就会释放所占用的端口号。

这样就解决了我的疑问，确实客户端也是要有明确的端口号分配的，具体讲比如浏览器它的端口看上去也是随机分配的，而分配范围是在“动态端口”范围，这个依据可以在 RFC-6335 中查到。

参考

https://www.rfc-editor.org/rfc/rfc6335.html

Chrome 浏览器小恐龙游戏变身超级马利奥

Fri, 27 Aug 2021 07:58:36 +0000

在线也能玩儿

很多朋友都玩儿过 chrome 浏览器在断网情况下的小恐龙游戏

其实它也可以在有网的情况下玩儿

在浏览器的地址栏输入 chrome://dino 并回车就可以了

而且它还会自动放大，更适合在浏览器玩儿

替换小恐龙为其他角色

第一步

打开浏览器在地址栏输入 chrome://dino 并回车

第二步

F12 打开控制台，找到 id 为 offline-resources 的 div 标签，在里面找到 id 为 offline-resources-1x 的 img 标签中的 src。

复制出 src 内的内容，粘贴到浏览器地址栏中，可以看到如下图片：

最后面那 8 只恐龙就是我们在界面上看到的内容，也就是要修改替换的对象。

8 只恐龙所代表的动作是

一、二张是跳起来的动作
三、四张是走路的动作
五、六张是死掉的动作
七、八是蹲下时的动作

第三步

我们从这个网站 https://www.spriters-resource.com/ 找一些角色图片来当替换资源用，里面有很多熟悉的角色，比如马利奥

第四步

我们将找到的资源图片和原始的小恐龙游戏图片全部下载下来，然后用 PS 进行操作替换（PS 不熟悉的可以找熟悉 PS 的小伙伴帮忙，我找的是我老婆，哈哈）

最后的成品大概是这样：

最后一步

将编辑好的图片导出为 PNG 格式，然后上传个图床（只要能通过网络访问到就行）

回到浏览器，地址栏输入 chrome://dino/ 打开小恐龙，F12 找到我们刚才找过的 id 为 offline-resources-1x 的 img 标签中的 src，将地址内容替换为我们在图床上的地址

再重新运行游戏，小恐龙就变成马利奥了

Chrome 插件

如果你很懒，想直接上手玩儿，也可以安装 Chrome 插件，有网友已经做好了现成的

https://github.com/superj80820/chrome-dino-cosplay

Chrome on 小盒子的技术分享

Postman 越来越臃肿了，我换了个开源的，还能让 AI 帮我写测试

如何在 mac 的 chrome 中开启 gemini 侧边栏

第一步

第二步

无损图像格式比较：PNG、WebP、AVIF 和 JPEG XL

什么是无损压缩？

何时使用无损压缩？

PNG

WebP

AVIF

JPEG XL JPEGXL

对比结果

文件大小

编码速度

总结

png

webp

AVIF

JPEG XL

AI 工具推荐

前言

工具

豆包

扣子

智谱清言

秘塔 AI

kimi

通义千问

perplexity

文心一言

Poe

Gemini

Claude 3

ChatGPT

工具对比

总结

我有罪啊--用了这么多年 mac 不知道访达有标签页

Arc 浏览器史诗级更新 ，换掉你的 Chrome 吧

Instant Links

如何用 Mac 电脑自动填充短信验证码

方法一 苹果原生解决方案

总结

还在用 Chrome？ Edge 已成为我的主力浏览器

可以截整屏的网页

朗读网页

数学求解器

引文

阅读模式

PDF

账户同步

其他

彩蛋

客户端请求的端口号是什么？

总结一下

参考

Chrome 浏览器小恐龙游戏变身超级马利奥

在线也能玩儿

替换小恐龙为其他角色

第一步

第二步

第三步

第四步

最后一步

Chrome 插件

Arc 浏览器史诗级更新，换掉你的 Chrome 吧

方法一苹果原生解决方案