🎉 Chrome 扩展「词焙+」上架

先广而告之一下,Chrome 扩展「词焙+」已经过审并且发布到 Chrome 应用商店了,欢迎戳这里安装体验~

开发

这个月的开发重心几乎全在词焙 Chrome 扩展上,做了一些局部重构的工作:

  • content_scripts 由纯手写 DOM 操作改为 React
  • 因为将整个插件所有页面都改成 React 之后打包出了一些奇奇怪怪的问题,于是改用 vite-plugin-web-extension
  • 开发扫码登录流程(浏览器插件、小程序、后端接口三端联动)
  • ...

踩了各种坑之后,Chrome 扩展开发初体验算是圆满结束

其他

这个月还抽空重装了一台应用服务器,然后把词焙 API 迁移了过去,并且接入了 EdgeOne CDN;

8 月初回老家参加好基友婚礼的时候顺便折腾了一下老家的网络,试了下 RouterOS 开启联通 IPv6 + DDNS6(为了给即将可能失去的电信公网 IPv4 做准备),结果就是不太理想,于是又折腾了私有部署 Tailscale,具体情况见下方新文章

文章

先说方案

使用 Docker compose 编排 Headscale + Headplane(一个很像 Tailscale 官方的 WebUI),使用 Caddy 来申请 TLS 证书(用 NGINX 也行,只是我懒,Caddy 可以帮我搞定 TLS 证书的自动申请和续期)并反向代理到 Docker 容器。

我直接用了 Headscale 自带的 DERP 服务,比网上找到的一些需要额外搭的 DERP 简单不少😎

需要准备的是一个域名和一台装好了 Docker 的服务器(如果需要买服务器,可以点后面链接购买腾讯云轻量应用服务器)。

后文会给出 Caddyfilecompose.yml、Headscale 和 Headplane 的配置文件示例,只需要简单修改(域名)即可直接使用。

阅读剩余部分

最近一个月(2025.06.19~07.18)输入跟输出各占一半吧,输入主要是把过去的一些东西复盘了一下,然后找资料,对旧东西有了新的认识,输出主要还是词焙相关的优化工作:

开发

  • 词焙新增了用户个人设置同步,新增了发音偏好:「国际音标」和「近似发音」,近似发音类似于小时候学英语写的谐音,不过用的是简短的英语单词,例如 wordsbaking 的近似发音是 wurds·bay·king,对于不想看音标的懒人来说是一种记发音的友好方式了吧🤣
  • 为了做划词翻译插件,优化了下 AI 翻译单词的队列,现在可以并发处理了(其实就是申请了多几个 API key,防止单个 key 超 rate limit)

其他

  • 申请了腾讯云 EdgeOne CDN,也体验了一把 EdgeOne Pages,托管了个开源小游戏,点此体验:TapMe小游戏合集
  • 重装了一台闲置的服务器

文章

写了两篇新文章,其中一篇是之前说好要写的两篇之一(还剩一篇迟点写):

微信小程序的 WXML 目前(2025.07)是不支持 <svg> 标签的,所以没办法直接使用 Lucide 这一类的图标,但小程序提供了 <image> 标签,是支持 SVG 格式的,但!直接用 <image> 引入 SVG 就没办法自定义颜色了。

有解决方案吗?有的,因为 <image> 是支持 base64 格式的,那我们动态创建 SVG 图标即可。

怎么动态创建呢,把图标的 SVG 字符串中的颜色熟悉(stroke)提取出来,将整个 SVG 字符串作为图标模板,然后用字符串的 replace() 替换即可。

本文的代码是 React + Taro,其他框架的思路是一样的,只是写法略有差异。这里需要用到 js-base64 这个库,记得先 npm 安装一下。

以 Lucide 的 book 图标为例,它的 SVG 是这样的:

阅读剩余部分

起因

事情起因是这样的:作为一名垃圾佬,手里有好几家云厂商的(低价)服务器,之前在阿里云广州已经部署了一个 MongoDB 副本集,现在想在腾讯云广州新增一个节点,于是按照 MongoDB 的官方文档执行

rs.add("xxx.xxx.xxx.xxx:27017")

一开始以为只需要在阿里云的防火墙安全组放通腾讯云访问、腾讯云安全组放通阿里云访问,结果折腾半天发现新节点一直处在 STARTUP 状态不会进入 SECONDARY,很纳闷。

后来用 telnet 发现不管是在阿里云还是腾讯云的机器上访问自身公网 IP:27017 也不通的,遂在各自防火墙上放通自己访问自己 27017 端口,新节点一下子就成功加入副本集了。

阅读剩余部分

过去一个月(2025.05.19~06.18)的重心仍然是开发,大部分时间都投入到了 词焙,也尝试了一些新的技术点

开发

开发工作中:

  • 词焙 Chrome 插件:完成了第一个版本,已实现功能:划词翻译,同时接了 AI 来扩充词库数据
  • 词焙单词数据处理:处理了已有词库的单词,补充了单词的变型形式和做了查询索引, 在后端处理单词变型数据上做了大量工作,包括数据变型的初步处理、引入了多线程优化数据处理效率,并对数据结构进行了变更和修正,也处理了单词变型数据的索引。
  • 词焙登录方式调整:考虑到后续 Chrome 插件等等客户端,只有单一的小程序登录是肯定不满足的,于是趁用户量还不大赶紧调整了登录方式
  • 调研了 Feistel 算法,调整了 passportaccess_token 生成算法

其他

最近广州电信连 Cloudflare Tunnel 有点不太稳,于是用了 Tailscale 组网,将 Cloudflare Tunnel 移到香港机和新加坡机,然后通过 Tailscale 子网反代到家里的机器,现在访问我博客的链路大概是 浏览器 -> CF -> 腾讯云香港/新加坡 -> 广州 🤣