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/"
    ]
}

• 需要跨域请求网站数据，所以permissions 需要配置地址。
• 需要后台运行，所以需要增加background的运行js文件。scripts是数组，自然也可以运行多个。

先来理解下逻辑：没啥理解的，就是做一个定时器，定时去请求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);

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

更多奇思妙想，等待你的发掘！