提醒我喝水chrome插件开发指南

im, 无色
im, 无色
im, 无色
884
文章
0
评论
2019年7月1日14:46:07 评论 496

起因

因为最近工作比较忙,经常忘记了喝水。作为一名前端开发人员,面对着浏览器工作是常态。所以这里为了解决这个痛点,面向前端开发人员写了一款浏览器插件。他的作用就是提醒喝水。
这里将半个小时设置为一个周期,大概和番茄工作法的原理一样。基本上集中注意力半个小时人也就累了。这个时候喝口水,舒缓一下紧张的神经。也作为一个休息的周期。为我们的工作继续高效的进行奠定了节奏。

成果

这是我做的浏览器插件
插件下载地址

开发思路

下面顺道介绍一下浏览器插件开发思路,编程不光要求理论还要有实践,撸起袖子直接干。

  • 开始直接github找了一个浏览器插件代码 下载到本地。
  • 再配合和segmentfault的这篇文章
  • 对照着练习。
  • 分析自己的需求,就是半个小时通知我一次,那么最简单的就是一个后台运行的定时器,每隔半个小时运行一次。
  • 关键点在于后台运行和通知。
  • 代码肯定是最简单的定时器,对于前端开发人员肯定不用多说,so easy!
  • 这里主要在manifest.json里面配置
    • 后台运行,关键代码
    // 参考代码
    "background":{//background script即插件运行的环境
        "page":"background.html"
        // "scripts": ["js/jquery-1.9.1.min.js","js/background.js"]//数组.chrome会在扩展启动时自动创建一个包含所有指定脚本的页面
    }, 
    // 实际代码
    "background": {
        "scripts": [
          "js/background.js"
        ]
     },
    • 通知,那就需要浏览器的通知权限了,看了单词,猜了一下那就是permissions这个了。
    // 参考代码
    "permissions": [ //允许插件访问的url
        "http://*/", 
        "bookmarks", 
        "tabs", 
        "history" 
    ], 
    // 实际代码
    "permissions": [
        "notifications"
     ],
  • 这里的notifucations这个参数是我参考人家写的插件里面找到的,当前我这是速成。
  • 正规的进行开发学习可以参考官方文档
  • 如果英语不好的同学可以看下这个
  • 360翻译的文档

可以参考这个看。

结语

感兴趣的可以下载插件进行使用

im, 无色
  • 本文由 发表于 2019年7月1日14:46:07
C# 开发Chrome内核浏览器(WebKit.net) Chrome开发

C# 开发Chrome内核浏览器(WebKit.net)

WebKit.net是对WebKit的.Net封装,使用它.net程序可以非常方便的集成和使用webkit作为加载网页的容器。这里介绍一下怎么用它来显示一个网页这样的一个最简单的功能。 第一步: 下载...
Google Chrome中的高性能网络 (三) Chrome开发

Google Chrome中的高性能网络 (三)

使用预连接优化了TCP连接管理   已经预解析到了主机名,也有了由OmniBox和Chrome Predictor提供信号,预示着用户未来的操作。为什么再进一步连接到目标主机,在用户真正发起...
匿名

发表评论

匿名网友 填写信息

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: