Chrome扩展程序:后台js偶尔无法从Popup js接收消息

时间:2016-12-29 09:22:46

标签: google-chrome-extension

弹出窗口上有一个按钮。单击时,popup.js将向background.js发送消息。它几乎一直都很好用。但是经过很长一段时间不运行chrome,当我点击按钮时,会发送消息(警报(“开始发送消息”)已执行)但无法通过background.js接收(警告(“开始渲染”) )未执行)。当我再点击一次时,它有时会起作用。如果它仍然不起作用,我会再次点击,第三次有更大的成功机会。这很奇怪。

我在popup.html中使用jquery,但我认为不重要。 popup.js中的Javascript代码

$('#create).html(chrome.i18n.getMessage('create'))
.on('click', function(){
    _current = null;
    chrome.runtime.sendMessage({
        cmd: 'SITEMAP_DEFINE'
    });
    alert("Start to send message");
    window.close();

})

background.js中的Javascript代码

var curTabId; //current tab in which scraper is going to scraping
var devtoolPort;
var coord;
var sitemap;
var finish = false;


function sendMessage(msg) {
  chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
    chrome.tabs.sendMessage(tabs[0].id, msg);
  });
}

//detective devtools
chrome.runtime.onConnect.addListener(function (port) {
    if (port.name == "devtools-papa") {
        devtoolPort = port;
    }
});

//tab update
chrome.tabs.onUpdated.addListener(function(tabId, changeInfo, tab) {
    if(finish === false && coord && changeInfo.status == 'loading'){
        coord.onUpdate(tab);
    }
})
chrome.tabs.onRemoved.addListener(function(tabId, removeInfo) {
    if(finish === false && coord && removeInfo.isWindowClosing === false){
        coord.onRemove(tabId);
    }
})
chrome.runtime.onMessage.addListener(function(msg, sender, callback){
    var p = msg.params;

    //scrape
    if(msg.cmd == 'START_SCRAPE'){
        sitemap = p.sitemap;
        if(sitemap){
            finish = false;
            coord = new Coordinator(sitemap, 0);
            var page = coord.sitemap.pages[0];
            coord.openTab(page.id, page.link);
        }
    }
    else if(msg.cmd == 'TEST_SCRAPE'){
        sitemap = p.sitemap;
        if(sitemap){
            chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
                var tab = tabs[0];
                sitemap.pages[0].link = tab.url;
                finish = false;
                coord = new Coordinator(sitemap, 20);
                var page = coord.sitemap.pages[0];
                coord.openTab(page.id, page.link);
            })
        }
    }
    else if(msg.cmd == 'SCRAPE_READY'){
        print(sender);
        coord.readyForScrape(sender.tab.id);
    }
    else if(msg.cmd == 'TAB_CLICK'){
        coord.currentPage = sitemap.getPage(p.page);
    }

    //define
    else if(msg.cmd == 'START_SELECT'){
        if(msg.tabId){
            chrome.tabs.sendMessage(msg.tabId, msg);
        }else{
            sendMessage(msg);
        }
    }
    else if(msg.cmd == 'END_SELECT'){
        if(devtoolPort){
            devtoolPort.postMessage(msg);
        }
        sendMessage(msg);
    }
    else if(msg.cmd == 'SITEMAP_DEFINE'){
        alert("Start to render");
        var url = p && p.url;
        sitemap = p && p.sitemap;
        chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
            var tab = tabs[0];
            if(url && url != tab.url){
                chrome.tabs.create({url: url}, function(newTab){
                    doInjectScript(newTab.id);
                })
            }else{
                injectScript(tab.id);
            }
        });
    }
    else if(msg.cmd == 'SITEMAP_DEFINE_END'){
        var _sm = p.sitemap;
        chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
            var tab = tabs[0];
            _sm.pages[0].link = tab.url;
            saveSitemap(_sm);
        })
    }
    else if(msg.cmd == 'SITEMAP_DELETE'){
        deleteSitemap(p.sitemap);
    }
    else if(msg.cmd == 'DEFINE_PAGE_LOADED'){
        callback(sitemap);
    }
    else{
        sendMessage(msg);
    }
});

var print = function(msg){
    if(curTabId){
        chrome.tabs.sendMessage(curTabId, {
            cmd: 'LOG',
            params: msg
        });
    }else{
        sendMessage(msg)
    }
}

function saveSitemap(_sm){
    var id = _sm.id;
    chrome.storage.local.get("sitemaps", function(db){
        var _sitemaps = db["sitemaps"];
        if(!_sitemaps || !_sitemaps.length){
            _sitemaps = [_sm];
        }else{
            var _idx = _sitemaps.findIndex(function(s){return s.id == id});
            if(_idx == -1){
                _sitemaps.push(_sm);
            }else{
                _sitemaps.splice(_idx, 1, _sm);
            }
        }
        var _db = {'sitemaps':_sitemaps}
        chrome.storage.local.set(_db, function(){
            alert(chrome.i18n.getMessage('saved'));
        });
    })
}

function deleteSitemap(id){
    chrome.storage.local.get("sitemaps", function(db){
        var _sitemaps = db["sitemaps"];
        var index = _sitemaps.findIndex(function(s){return s.id == id})
        _sitemaps.splice(index, 1);
        var _db = {'sitemaps':_sitemaps}
        chrome.storage.local.set(_db, function(){
            alert(chrome.i18n.getMessage('deleted'));
        });
    })
}

function injectScript(tabId){
    var flag;
    chrome.tabs.sendMessage(tabId, {
        cmd: 'SELF_CHECK'
    }, function(r){
        flag = r;
    });
    setTimeout(function(){
        if(flag){
            chrome.tabs.executeScript(tabId, {file: "injected/define/initUI.js"}, function() {});
        }else{
            doInjectScript(tabId);
        }
    }, 200)
}

//Injected scripts will be removed once the tab reload again.
function doInjectScript(tabId){
    chrome.tabs.executeScript(tabId, {file: "injected/listener.js"});
    chrome.tabs.executeScript(tabId, {file: "lib/jquery/jquery-2.1.1.min.js"}, function() {
        chrome.tabs.executeScript(tabId, {file: "lib/model.js"});
        chrome.tabs.executeScript(tabId, {file: "lib/css-selector-generator.js"}, function() {});
        chrome.tabs.executeScript(tabId, {file: "injected/SelectTool.js"}, function() {});
        chrome.tabs.executeScript(tabId, {file: "injected/define/initUI.js"}, function() {});
        chrome.tabs.insertCSS(tabId, {file: "injected/injected.css", runAt: "document_end"});
    });
}


function createResultTab(title, fields, data){
    chrome.tabs.create({url: chrome.extension.getURL('result/table.html')}, function(newTab){
        var tabId = newTab.id;
        setTimeout(function(){
            chrome.tabs.sendMessage(tabId, {
                cmd: 'RESULT',
                params:{
                    data: data,
                    title: title,
                    fields: fields
                }
            });
        }, 200)
    })
}

提前感谢您的帮助。

1 个答案:

答案 0 :(得分:0)

我在official document找到答案。 如果我们设置持久性 = false,则后台js将在空闲时卸载。

{
  "name": "My extension",
  ...
  "background": {
    "scripts": ["eventPage.js"],
    "persistent": false
  },
  ...
}

该文档告诉从内容脚本发送消息将导致后台js重新加载。但我想弹出脚本的消息有问题。

因此,要么在弹出窗口中更改持久性 true chrome.runtime.getBackgroundPage 以导致后台重新加载,将解决此问题。