chrome系列-扩展程序开发学习-后台运行

chrome系列-扩展程序开发学习-后台运行

月光魔力鸭

2018-09-09 07:27 阅读 422 喜欢 0 chrome系列 后台运行

在程序中,会有需要后台一直运行的场景。这一节我们来做一个监控某网站的运行状态,如果没有运行,则改变当前的图标。

由于这个扩展程序没有页面展示,只是后台运行,所以我们的manifest.json 是这个样子的:

{
    "manifest_version":2,
    "version":"1.0",
    "name":"监测BYYUI运行状态",
    "icons":{
        "16":"img/icon16.png"
    },
    "browser_action":{
        "default_icon":{
            "16":"img/icon16.png"
        },
        "default_title":"监测BYYUI运行状态"
    },
    "background":{
        "scripts":[
            "demo.js"
        ]
    },
    "permissions":[
        "http://www.byyui.com/"
    ]
}

先来理解下逻辑:没啥理解的,就是做一个定时器,定时去请求http://www.byyui.com/的页面,如果有返回值且状态正确,则是正常运行,否则就是离线。

上代码:

function request(url,cb){
    var xhr = new XMLHttpRequest();
    xhr.open('GET',url);
    xhr.onreadystatechange = function(){
        if(xhr.readyState === 4 && xhr.status === 200){
            cb(true)
        }else{
            cb(false);
        }
    }
    xhr.onerror = function(){
        cb(false);
    }
    xhr.send();
}

setInterval(function(){
    request('http://www.byyui.com',function(flag){
        chrome.browserAction.setIcon({path : flag ? 'img/icon16.png' : 'img/icon-close16.png'});
    });
},5000);

好了,就这些,让我们来看下效果图。

假装有效果图

更多奇思妙想,等待你的发掘!

转载请注明出处: https://chrunlee.cn/article/chrome-learn-4.html


感谢支持!

赞赏支持
提交评论
评论信息 (请文明评论)
暂无评论,快来快来写想法...
推荐
写到这里,基本上就完成了我之前一篇文章中写的,我要做一个自己的图床的小程序了。在最初我要做图床的时候,发现在谷歌扩展程序上一无所知,所以才开始学习的这个,到这一步,至少能勉强能跑通自己的小程序了。
登录方式现在非常多,不过像我这种小站让用户自己注册基本是不可能的了,只能依赖现有的第三方的登录来集成,之前有集成github,不过这个太过针对性,这里准备集成QQ互联登录,慢慢记录下。
当我们使用web打印相关的解决方案的时候,还有不少小坑值得注意下,同时需要了解几个小技巧提升在web打印上的友好度,以下整理一些常见的小技巧
docker build 执行yum失败,找不到repo
ubuntu 配置nginx反向代理,这里简单记录下,后续再复习..
简单记录下碰到的一个问题,通过jenkins 远程部署springboot+ vue 项目碰到的问题。
通过registry 自建 dockerhub
前一阵子做了个图床,可以粘贴上传,查看服务器上的文件... 但是自己的服务器总是有问题..空间还小,就怕哪天没钱续费了。同事昨天想要一个七牛的图床,在网上找了下,只找到了 qiniu upload files插件,自己使用了下,挺好用,但是没有复制粘贴