如果在文檔加載后運行，事件偵聽器將收到空詳細信息

Question

我一直在為Chrome擴展程序。

為了正常工作，它必須使用CustomEvent將網站設置的全局窗口變量傳遞給擴展程序的主腳本。
當頁面被加載到活動選項卡中時，這通常可以正常工作，但是每當頁面被作為非焦點選項卡加載時，或者當擴展腳本的執行被延遲時，偵聽器接收到的事件對象都將具有null detail屬性。

只需清楚一點，該事件的整個detail對象為null ，而不僅僅是所需的變量。 我已經通過將所需的變量作為JSON字符串附加到文檔中來解決此問題，但我想了解事件出了什么問題。

代碼的相關部分如下。

manifest.json的：

"content_scripts": [ {
          "js": [ "main.js", "jquery-3.3.1.js"],
          "matches": [ "*://*.site.com/*"],
          "run_at": "document_end"
       } ],
"permissions": [ "declarativeContent", "activeTab", "storage", "*://*.site.com/*" ],
"web_accessible_resources": [ "injectedScript.js" ]

main.js：

$(function() {

        document.addEventListener('globalPasser', function(response) {
            if(response.detail){
                // store variables
            }

        }, true);

        var passGlobals = document.createElement('script');
        passGlobals.src = chrome.extension.getURL('injectedScript.js');
        (document.head||document.documentElement).appendChild(passGlobals);
        passGlobals.onload = function() {
            passGlobals.remove();
        };
    }

injectedScript.js：

var newEvent = new CustomEvent('globalPasser', {detail:{variable: neededGlobalVariable}});
document.dispatchEvent(newEvent);

Answer 1

解決方法/修補程序是通過JSON簡單地“清理”數據：

document.dispatchEvent(
  new CustomEvent('globalPasser',
    JSON.parse(JSON.stringify({
      detail: {
        variable: neededGlobalVariable
      }
    }))
  )
);

這種情況下的問題是由數據中存在JS函數引起的，有時是在站點仍在處理某些內容時引起的。 DOM節點會引起同樣的問題。

有意或無意，但是Chrome從https://crbug.com/85158開始中止序列化整個detail對象並將其傳輸為null ，並且此行為與擴展消息傳遞異乎尋常地不同，擴展消息傳遞跳過了此類不可序列化的內容： {foo: functionRef, bar: 123}被傳送為{bar: 123} 。