javascript - Why is chrome.runtime undefined?

Question

I am creating a Google Chrome extension (my first one) and I want to send messages from the extension to the current tab.

I am following the documentation:

https://developer.chrome.com/apps/runtime#event-onMessage

The extension loads a small external JS into the tab's HTML, which contains the following code:

chrome.runtime.onMessage.addListener(
    function(request, sender, sendResponse) {
        console.log(request)
    }
);

As soon as the JS is loaded I get the following error:

Uncaught TypeError: Cannot read property 'onMessage' of undefined.

Opening console and typing chrome, I can see that the runtime is not a property of chrome.

It looks like I am doing something wrong, but what? Do I need to add something to the manifest.json file?

Chrome Version 39.0.2171.71 m

Thank you.

Answer 1

If you're inserting JavaScript into a page with a <script> tag, it executes in the page's context.

Sometimes it is desirable: that's the only way to access page-level JavaScript objects.

But in your case it means that the code does not have access to Chrome APIs, as it is "the same" as the page's code.

You need to look into communicating between page-level and context scripts, or between page-level and background (spoiler, in most cases needs a context script proxy anyway).