引言

背景介绍

在闲鱼这个二手交易平台上，及时回复买家的消息对于卖家来说至关重要。之前，我发了一个风向标，说闲鱼网页版支持消息回复了，有圈友反馈没有提示音很难受，开始我以为是没允许网页提醒，问了圈友说允许了，当时回复了圈友说那可能有些bug，就没继续了，后来有一天手机和网页都没收到提醒，几十分钟了都没回复客户，就想着编写一个油猴脚本看看，最终无果，可能是姿势不对，但也就放下了，反正也不急需。

昨天(2024年11月26日)咨询量多了起来，主要是有个客户发了好多条消息，我主要是电脑看，想着要不用Chrome编写一个闲鱼消息提醒插件好了，于是就开始行动了。

对编写过程不感兴趣的朋友可以直接跳转到附录下载插件和查看第六章节Chrome插件安装进行安装插件。

为什么选择Chrome插件

Chrome插件提供了更直接的网页交互方式，可以把mp3提醒声音打包到插件里，比网址更稳定，且之前尝试过油猴插件，但效果并不理想，可能是因为使用方式不正确，所以就试试编写Chrome插件看看。

准备工作

怎么实现

1、闲鱼网页版有新消息的时候网页标签页就会变成[新消息]开头，所以要想判断是否新消息可以从网页标签页信息是否包含“[新消息]” 2、闲鱼网页版的地址是“https://www.goofish.com/”、消息地址是“https://www.goofish.com/im”开头的，包含网址时启用插件 3、因为需要调用本地mp3文件，所以需要准备个提醒信息mp3文件 4、Chrome插件需要icon图标，需要准备，我让CurSor帮我生成了。

必要的工具和库

CurSor开发工具

Chrome浏览器（用于开发和测试）

svg转png工具（后面用CurSor生成svg图标，需要用svg转png工具转换），CurSor提供了：https://svgtopng.com/

配音工具（我是用了微配音制作提醒声音）

Chrome插件基础

基本概念

Chrome插件主要由以下几个部分组成：

manifest.json：定义插件的元数据，如名称、版本、权限等。

background.js：在后台运行的JavaScript代码，用于监听和处理事件。

content.js：在网页内容中运行的JavaScript代码，用于与网页交互。

popup.html：如果插件需要与用户交互，可以提供一个用户界面。一般还会带popup.js

icon文件：Chrome插件需要特定大小的图标文件，通常包括16x16、48x48、128x128像素的PNG格式图片。文件名为：icon48.png、icon64.png、icon128.png

其他：css、js等文件

为了更好的阅读体验，来飞书看吧：

https://w63nbfedzw.feishu.cn/docx/HN2Md8wzaomnG0xf71tcdbYynTf