1

In my chrome extension I want to have a background script for obvious reasons. However I now also want to have a background page in which I like right here discribed load some html (Chrome extension: loading a hidden page (without iframe)) using an iFrame which I can interact with using a content script. But when I'm trying to load both the background script and the background page like so:

...
"background":{
    "scripts": ["background_script.js"]
},
"background": {
    "page": "iFrameBackground.html",
    "persistent": true
},
...

and then try to send a message from my content script to the background script I get this error:

Unchecked runtime.lastError: Could not establish connection. Receiving end does not exist.

So either I'm missing something entirely here or are you really just able to use one of the two?

Thank you :)

Grashalm5020392
  • 13
  • 4

1 Answers1

0

Problems

  1. Only one declaration method can be used.
  2. Your json is invalid as it has two identical keys so Chrome won't even install it.

Solution

Choose just one method. Any method.

You can access DOM in your background script/page regardless of the way it's declared.

The result of each method is identical: they both create a background page. An extension can have just one background page where any amount of background scripts are loaded - just like in any other web page. The scripts method exists just for convenience: it simply generates a dummy HTML page as you can see in devtools inspector for the background page.

wOxxOm
  • 65,848
  • 11
  • 132
  • 136
  • Thank you for your answer :) So what youre saying is just one persistent background script? And how would i put an iFrame into it? Just write it like an html-page with a script tag? – Grashalm5020392 Oct 24 '20 at 17:17
  • You seem to be overthinking it. There can be any amount of scripts but they will be running in one page. You can create and add an iframe element in that page just like you would do it in any other page. – wOxxOm Oct 24 '20 at 17:26
  • :) yeah probably. But I still don't get how to do that in practice now. So you're saying two background scripts one of which is an html page? Would I even need a content script to get the iFrame content then? – Grashalm5020392 Oct 24 '20 at 17:59
  • like: "background":{ "scripts": ["background_script.js", "iFrameBackground.html"] }, – Grashalm5020392 Oct 24 '20 at 18:00
  • In `scripts` you can only list ... scripts! That is js files. You don't need iFrameBackground.html. You can use DOM in your js files, see any tutorial for document.createElement and so on. This is really basic web dev stuff. – wOxxOm Oct 24 '20 at 18:11
  • ahhh okay but does that then mean i dont have to use a content script? would make my life so much easier... xD – Grashalm5020392 Oct 24 '20 at 18:20
  • Content script is a totally different thing, not affected by anything in this topic. – wOxxOm Oct 24 '20 at 18:42
  • yeah but the thing is i need to get the content of the iFrame to the background script and since it is now in the same page a content script that reads the iFrame isnt really needed anymore or am i not able to access the content of the iFrame without a content script? – Grashalm5020392 Oct 24 '20 at 18:48
  • No, you got it all wrong again. The background script runs in the background page. The background page is a separate hidden page where all background scripts run. In any of your background scripts you will create an iframe and add it to DOM. To the DOM of the background page because just like any page it has its DOM. That iframe will load its site and a content script declared in manifest.json will automatically run there. That content script will use messaging to communicate with the background script as shown [here](https://stackoverflow.com/a/39901725). – wOxxOm Oct 24 '20 at 19:06
  • no i understood that part. I was just wondering whether if I'm able to add the iFrame to the DOM using the background script i might as well just be able to read its contents as well. But i guess not then... :/ – Grashalm5020392 Oct 24 '20 at 19:21
  • The ability to read the contents of iframes or windows in modern Chrome is determined by the origin of the URL: a cross-origin iframe/window cannot be accessed directly. Extension's background page has its own URL that looks like chrome-extension://id/.... and the iframe has a web URL like `http://foo/` so as you can see they will always be cross-origin. – wOxxOm Oct 24 '20 at 19:33
  • ahh i see so a content script is still needed... Thank you for your answer :) – Grashalm5020392 Oct 24 '20 at 19:56