chrome插件更新可以不依赖于google store

还是那个github插件，老板提出当有新的版本发布后，可以提示用户，并让用户自主下载。
考虑到安全性和经济问题（注册开发者账号就需要$5.00），暂不考虑将它发布到google store里，具体操作自己想。好吧，是一个挑战。
下载页面好弄，可以按照github上release页面去设计，每当我有新的版本发布后，在release页面更新新的安装包，然后插件里option.html页面里动态去拿这个页面的信息。如下：

image.png

弹出该框可以用插件里options_ui设置来完成，用下面方法当点击浏览器图标的时候弹出新的tab页面。

  chrome.tabs.create({ url: 'chrome://extensions/?options=' + chrome.runtime.id });

这里我们有了新版本的下载链接，版本信息。那么做到更新的话还需要当前用户使用的版本信息。

image.png

如果了解content-script.js和background.js的使用范围就很好办了，做法如下：
content-script.js里面我们去定时获取当前github上最新版本的信息（有api可以使用），本地用户版本我们可以通过文件获取。然后进行比较，一旦发现版本不一致，将message传递到background.js里面，由background.js去创建badge。background.js是一个守护进程，会一直运行在后端。

\\content-script.js
checkVersion:function(callback){
        var obj = {}
        var intervalId = setInterval(function(){
            let currentVersion = configUtil.CHROME_SCRIPT_VERSION
            console.log('currentVersion',currentVersion)
            apiUtil.getLatestVersion(function(data){
            console.log('server version',data)
            let hasNew = data.version !== currentVersion
            obj['latestVersion'] = data.version
            obj['hasNew'] = hasNew
              if(hasNew){
                chrome.runtime.sendMessage({hasNew: true}, function(response) {
                    console.log('receive data from backend：' + response);
                });
                }else{
                    clearInterval(intervalId)
                }
            })
           callback(obj)
         },10000*60)
    }

\\background.js
chrome.runtime.onMessage.addListener(function(request, sender, sendResponse)
{
    if(request.hasNew){
        chrome.browserAction.setBadgeText({text: 'new'});
        chrome.browserAction.setBadgeBackgroundColor({color: [255, 0, 0, 255]});
    }else{
        chrome.browserAction.setBadgeText({text: ''});
    }
    sendResponse('call successful')
});

到这里我们可以做到一旦版本不一致，我们可以在图标上有new的提示。那么如果我们还需要提示用户当前最新的版本是什么，或者我们给出下载链接呢？
也是可以做到的，我们使用chrome.storage。首先在manifest.json里申明可以使用storage，然后在查到有新的版本时，将信息存到storage里。

var obj = {
                  'latestVersion':result.latestVersion,
                  'hasNew': result.hasNew
              }
       window.chrome.storage.sync.set({
                'versionInfo': obj
       },
          function(){
              console.log('set value successfully.')
          }
        );

在需要的地方获取即可：

function getVersionValue(callback) {
        chrome.storage.sync.get(['versionInfo'], callback);
}

实现如下效果。

image.png

这样看起来是不是达到了提示用户有新版本的初衷了，不仅安全，还省钱。为公司有我这样的员工鼓掌，哈哈。

再不完美的行动，也胜过被动的等待。五步、十步都是进步，顿悟、渐悟都是领悟。