简单做了个黑客派社区浏览器扩展

Browser extension for HacPai,优雅便捷的黑客派社区插件

忙里偷闲。之前研究 pwa,就想了解下 Chrome 扩展的开发。终于偷出时间看了,也算是完成了一个 TODO。

功能

主要是为了了解下浏览器扩展的开发,就先简单弄了几个功能。后面有空(大概是假的)再弄些功能吧。

源码

有想弄的功能可以提出来(虽然通知,快捷键,社区功能都有了 😂 ),欢迎 PR。trollface

Chrome 扩展开发

总体而言,Chrome 扩展开发还是挺简单的,文档也很全面。基本没啥好讲的。

文档链接:

https://developer.chrome.com/extensions/getstarted

Chrome APIs - Google Chrome

当然开发过程中,也遇到一些槽点,懒得吐了。有空再多研究研究吧,= =。

Chrome 扩展提供的展现形式,功能接口,工具类都很丰富。感觉可以干很多事情(怪不得很多扩展审核被拒 😂 )。

就是要注册 Chrome 网上应用店开发者,然后要支付 $5。

image.png

后面我还是要发布其他扩展或者应用(可以发布 20 项内容),就注册个吧。

注册还要 VISA 卡,然后审核,隐私申明....

虽然有卡,但是不在身边,也懒得弄。有妙招的,可以协助下 😂 。

开发轶事

想弄一个黑客派社区的 logo,就在 https://hacpai.com/article/1563882928300 这篇帖子里拿了下 logo,结果发现像素好低,ps 折腾半天也没法拯救。然后想想不对啊,怎么会连个 svg 的 logo 都没呢???

然后我发现左上角的 logo 不就是 svg 的吗?😂 不知道当时咋想的。然后用 svg 整了几个 png 图标。

<svg viewBox="0 0 32 32">
    <path fill="#d23f31" d="M5.787 17.226h17.033l5.954 9.528c0.47 0.752 0.003 1.361-1.042 1.361h-15.141z"></path>
    <path d="M10.74 3.927h17.033c1.045 0 1.512 0.609 1.042 1.361l-5.954 9.528h-19.872l6.379-10.209c0.235-0.376 0.849-0.681 1.372-0.681z"></path>
    <path d="M2.953 17.226h2.839l6.804 10.889h-1.892c-0.523 0-1.137-0.305-1.372-0.681z"></path>
</svg>

后来用 chrome.browserAction.setIcon 发现图标尺寸是有限制的,😳 。好吧,做了个 38*38 的才可以。

感觉我不是来研究 Chrome 扩展开发的,是来研究黑客派 logo 的。

@88250 @Vanessa

发帖,咋不弄个草稿功能 😳

打赏 6 积分后可见
6 积分 • 5 打赏
  • 黑客派

    黑客派是 B3log 开源社区的线上论坛,这里主要汇聚了程序员和设计师。HacPai 分别取 Hacker / Painter 的头三个字母组成,源自《黑客与画家》。

    我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

    更多细节请浏览黑客派简介

    368 引用 • 7469 回帖 • 536 关注
  • 插件
    51 引用 • 197 回帖
  • 创造

    你创造的作品可能会帮助到很多人,如果是开源项目的话就更赞了!

    79 引用 • 454 回帖 • 2 关注
17 回帖
请输入回帖内容...
  • 88250

    首先感谢你花时间精力进行开发,其次我有些想说的:

    1. B3log 相关 logo 可以在这里找到
    2. 签到几天前已经调整为:只要登录后访问任何页面就会自动签到,节省大家时间
    3. 看帖子时按 t 就可以返回顶部了,更多快捷键支持请看这里
    4. 草稿功能可以用浏览器本地存储,编辑器自动会保存的;如果要离线的话用链滴笔记

    感谢感谢 ❤️

    1 回复
  • ghostsf

    😂没搜到 logo 的页面。嗯嗯,社区功能已经很多了。❤️

  • Vanessa

    草稿我现在用链滴笔记。。。

    突然想起来聊天室好像有人做了个统计人数的插件。。。

    1 回复
  • ghostsf

    我也去用链滴笔记 😂

  • adlered

    我以为打赏区是 Chrome 商店的下载地址......

    1 回复
  • ghostsf

    我就测试看下打赏区功能 = =。可以先加载扩展程序使用。

    1 回复
  • adlered

    安装上了。消息提醒只要 Chrome 打开就会有哈?

    1 回复
  • ghostsf

    嗯嗯,是的

    1 回复
  • adlered

    ok 的,我试试

  • happy521

    666

    1 回复
  • jing666

    666

  • csfwff

    huaji 可以再整合一下这几个内容嘛,我么的开发者账号,毕竟要 5 刀 😭
    论如何正确地在聊天室摸鱼

    2 回复
  • adlered

    双击置顶可以关掉吗,我喜欢双击复制东西

    2 回复
  • ghostsf

    哦哦 可以 回头把设置页面弄下

  • ghostsf

    😂 OK

  • ghostsf

    😂 加进去了

  • ghostsf 1 评论

    简单弄了个设置开关

    按摩椅很好用,我妈妈都开心哭了
    adlered
请输入回帖内容 ...