椒盐豆豉

如何制作一款简单的 chrome 插件

July 19, 2022
重启电脑
code | tutorial | patreon

短短几年时间，Chrome 作为一款在主流桌面操作系统（Windows，Mac）不内置的第三方浏览器，短短几年时间击败了所有竞争对手，以压倒性优势 67% 的市场份额稳居桌面端浏览器头把交椅。虽然近年来对其隐私方面顾虑层出不穷，一些 power user 也会试图寻找替代品（Brave，Duckduckgo 之类），但对于绝大多数网民来说还是浏览器的默认选择。

在前端技术越来强大的今天，普通 desktop 用户很多客户端操作都能被网页版替代。拥有庞大的潜在客户群，javascript 上手难度低，浏览器作为运行环境无需担心与系统交互与测试，有 chrome store 管理分发，安装过程也比客户端简单很多，chrome extension（插件）就成了一个对开发者和使用者都轻量、便捷的实用平台。

与此同时，chrome 插件的使用门槛也比让看到代码就头大的用户自己安装油猴 script 低很多，就像跟人安利 app 直接甩 play store 链接肯定比让人下载 apk 容易一样。还有同步的便利（我收到过好几次“为什么不写成油猴 script”的评论……代码就开源在那里，不想走 chrome store 且会用 script 的自然可以去用 script 嘛，反之 store 用户又不能从油猴 script 里轻易变出一个能同步的插件）。

这是拖后了半个月的作业六月 patreon 博客票选胜出的命题（说实话我完全没想到会有这么多人想看开发相关，论我的读者到底有多少码农）。欢迎金主们去七月的投票选出接下来的命题：

  • 我的信息摄取探索 2.0
  • 老年码农合理摸鱼经验总结
  • 非程序员掌握了也很有用的小 hack
  • 美国码农前半段职业发展道路（career ladder）

其实我不知道为什么大家会选这个主题，因为 Chrome 官方的 Developer Guide 写的还蛮清楚的，也给了现成的例子可以抄。不过既然金主们投了，我就来试图给平时不那么经常写程序，但是对自己开发插件有点兴趣的朋友们 TLDR 一下，用我写过的一个简单插件做为例子手把手走一遍开发简单 chrome 插件的过程。

...