Skip to content

rictt/bilibili-comments-helper

Repository files navigation

过程分享 - 我的第一个Chrome插件

我做的这个插件比较简单,就是下载B站评论,提取视频关键字、图表展示;因为功能比较简单,需要到的权限也不多;主要是技术选择上还有发布过程中遇到了些问题,,在这里简单分享下;

省流

如果你也要做一个chrome插件,那么下面几个东西是推荐你先准备或者了解的

  • 插件不像App可以设置价格,也就是如果你想盈利,一般要内置付费功能,比如会员、兑换码这种(需要自行开发)
  • 5刀的注册成本,国内开发者大概率需要淘宝买对应的服务(国内招行visa已试,不支持)
  • 基本的html、js、css即可上手(如果是前端开发者,推荐plasmo脚手架

正题

第一个问题:注册成本

开发者注册,你要在chrome插件商店发布你的插件,你首先要注册成为「chrome开发者」,需要缴纳5美元进行认证,这是一次性的。缴纳只接受(重点)visa、万事达、jcb、discover这些卡,然后我就试了我招行的双币visa信用卡,结果!!不支持,在网上查了一圈发现有不少人也遭遇过,主要是几种可能

  • 登录的chrome账号锁区了,不在chrome支持的区域
  • chrome那边没对接招行visa,试一下其他行
  • 也有万事达失败的

本来想在网上申请一张万事达然后寄过来的,但是至少几天的时间,而且不一定支持!于是在上淘宝关键字买了张卡试,对面发了一些注意事项和步骤,按着说明最后注册成功了,主要是

  • 全程米国IP环境
  • 提示支持失败,不要连续支付(可能锁卡,这时候找客服帮助)

5刀的卡,虽然花了60RMB,但能减少我办卡和各种找玄学方案花费的时间,我个人是可以接受的

PS:有类似需求的同学,下单前一定要问一下如果卡不支持支付,能不能退(因为给的卡可能也用不了)

第二个问题:技术选型

其实直接html、js、css撸也可以(毕竟比较简单)

但我自己之前有折腾过插件开发,觉得原生HTML开发效率比较低,比如每次改代码需要手动刷新、加载插件,才能生效;其次是不能和Vue、React现代框架结合起来开发

调研了一圈找到国外plasmo这个库,有什么特性呢

  • 重点: 支持改代码后自动刷新(应该是通过CDP协议去实现的,有趣)
  • react + typescript开发方式
  • 可选的Vue、Svetle开发(没试过)
  • 其他常见的处理(上传一份icon,自动生成不同大小平台的icon等)
  • 还有远程加载这些等等...

第三个问题/建议:Icon/UI

发布插件,需要有插件Icon、插件说明;

一般来说正经公司都会有UI资源,但我们是自己弄着玩呀!

我是怎么找插件Icon的呢,直接在iconfont上搜关键字,看到个符合「评论」的icon,然后在线调颜色,下载对应的比例下来,就很省事!

(好像有点水)

第四个问题:审核

前后大概提前了4、5次版本,好几次审核不通过的原因说是:包含v3禁止的远程代码,我以为是plasmo打包后的产物有问题,研究几次审核都失败,后面认真读了审核反馈提到的文档,提到判断有没有远程代码的逻辑:优先检查产品是否带有http、https的链接

我的插件因为有个功能是导出数据下载成HTML显示,依赖了一些第三方的CDN资源,然后我就把这部分https链接,通过js拼接script资源地址下载,最后就审核成功了

最后

我发布的插件叫做:B站评论助手,没什么用,写着玩;

感兴趣的话可以在商店下载:这里下载链接

Releases

No releases published

Packages

No packages published