Search code examples
javascriptgoogle-chromegoogle-chrome-extensionpostmessagewebcrypto-api

Using postMessage to extension background page


I'm trying to send a CryptoKey (generated by SubtleCrypto.generateKey()) object from a contentscript to the background page of a webextension.

When using chrome.runtime.sendMessage to send the object, it is lost, as CryptoKey is not stringifyable (see also this question). Using window.postMessage to transfer the key to another window does work, as this method uses structured cloning..

Is there something similar to postMessage to send data that is not stringifyable to the background page of a webextension?


Solution

  • Thanks to the comment by @wOxxOm I solved it by creating a web accessible resource with this code:

    window.addEventListener("message", receiveMessage, false);
    
    function receiveMessage(event) {
      chrome.extension.getBackgroundPage().postMessage(event.data, "*");
    }
    

    This is triggered by the contentscript like that:

    let iframe = document.createElement('iframe');
    iframe.setAttribute('src', chrome.extension.getURL('webaccessible/index.html'));
    iframe.addEventListener("load", () => {
      iframe.contentWindow.postMessage(data);
    })
    

    While data is an object that contains the CryptoKey.

    This data is received in the background script just like you normally would receive such messages:

    window.addEventListener('message',(event) => {
      console.log(event);
    });