Question

I am developing a chrome extension which injects an iframe in a particular webpage as soon as it loads. The iframe loads a form(form.php) hosted on localhost. All the information entered on the form is processed by script.js on the localhost.
The PHP File has:

<script src="script.js" type="text/javascript"></script>

There is a submit button on the php file. When it is clicked I want to pass a message and some data to the extension’s background page like:

chrome.extension.sendRequest({'name':'email', value:email});

but I get an error saying:

Uncaught TypeError: Cannot call method ‘sendRequest’ of undefined

What I want is, once the submit button is clicked, all the data that is processed is sent to the chrome extension background page.

Please suggest me any method that can help me do that?

Answer 1

If I understand you right, you want to send a message to the chrome extension background page from the Iframe.

One way to do this is to inject a content script in the the webpage and have it listen for messages

window.addEventListener(‘message’, ….)

On the Iframe, when the data is ready, you can call

parent.postMessage

to send a message to the content script in the parent. The content script can forward the message to bg using

chrome.extension.sendRequest

Another way is to inject the content script in the Iframe itself by setting

all_frames: true

in the extension manifest.