Chrome擴展程序sendResponse無法正常工作

Question

這個問題有很多版本，我已經對其進行了審查，並盡我所能嘗試了很多事情，但沒有成功。 我是chrome擴展的新手，可能會錯過很多東西，但我不知道是什么。

首先，我想指出的是，我已經從各種答案中復制了幾個聲稱的工作示例，但沒有一個對我有用。 我正在Windows 7 Professional上使用Chrome版本58.0.3029.81。

無論是我的代碼還是我復制的示例，內容腳本中的代碼都會執行，並以正確的響應調用sendResponse。 除此之外，什么都沒有-永遠不會執行指定的回調函數。

這是我當前的代碼：

的manifest.json

 { "manifest_version": 2, "name": "TestExtension", "description": "...", "version": "1.0", "content_scripts": [ { "matches": [ "http://*/*", "https://*/*" ], "js": [ "content.js" ] } ], "browser_action": { "default_icon": "icon.png", "default_popup": "popup.html", "default_title": "Send a checkpoint request" }, "permissions": [ "activeTab", "tabs", "http://*/*", // allow any host "https://*/*" // allow any secure host ] } 

popup.js

 document.addEventListener('DOMContentLoaded', function () { document.getElementById('extension_form').onsubmit = function () { var elementName = "DataAccessURL"; chrome.tabs.query( { active: true, currentWindow: true }, function (tabs) { chrome.tabs.sendMessage( tabs[0].id, { Method: "GetElement", data: elementName }, function (response) { debugger; console.log("response:Element = " + response.Element); alert(response.Element); }); }); }; }); 

content.js

 chrome.runtime.onMessage.addListener(function (request, sender, sendResponse) { console.log("In Listener"); if (request.Method && request.Method == "GetElement") { var result = ""; var element = request.data; console.log(element); var e = document.getElementById(element); if (e) result = e.innerHTML; console.log(result); sendResponse({ Element: result }); return true; // <-- the presence or absence of this line makes no difference } }); 

任何線索將不勝感激。 我根本不明白為什么未調用我的回調。

Answer 1

用戶wOxxOm在其評論中提供了此答案。

在popup.js示例中，我將附加到表單“ onsubmit”事件以觸發我的代碼。

之前我曾讀過，如果彈出窗口關閉，則不再有代碼可以運行。 正如wOxxOm所指出的，我無法直觀地看出我的情況是Submit事件重新加載了彈出窗口。 那是斷開我的代碼。

為了防止重新加載彈出窗口，我需要防止對Submit事件執行默認操作。 我添加了一個“ evt”參數來接受事件參數到提交，並調用了preventDefault，如下所示。

document.getElementById('extension_form').onsubmit = function (evt)
{
    evt.preventDefault();
    ...

這樣可以使樣本按預期工作。

謝謝wOxxOm！