Accessing global object from content script in chrome extension

后端 未结 1 1995
盖世英雄少女心
盖世英雄少女心 2020-12-05 08:54

I have defined a global object in a .js file. For example file1.js contains the global object SomeObject. This file gets loaded in background.html.

Since file1.js i

相关标签:
1条回答
  • 2020-12-05 09:35

    There is no way to get direct access to the background page's global object from a Content script or injected script.

    To use a background page's method from an injected script , follow these steps:

    1. Content Script: Bind an event listener to the page example 1.
      Whenever you want to notify the method from the background page:
    2. Injected script: Create and fire this specific event example 1.
      → The event listener from 1) gets triggered.
    3. In this event listener, use chrome.runtime.sendMessage to request the functionality from the background example 2.
    4. In the background page, handle this request using chrome.runtime.onMessage.
    5. Optionally, inject code in the original tab using chrome.tabs.executeScript(tab.id, func).

    To use a background page's method from a Content script, only steps 3 and 4 are needed.
    Here's an example, in which the content script communicates with the background page:

    // Example background page
    function some_method(arg_name) {
        return localStorage.getItem(arg_name);
    }
    chrome.runtime.onMessage.addListener(function(request, sender, callback) {
        if (request.type == 'localStorage - step 4') {
            callback( some_method(request.name) );
        } else if (request.type == 'localStorage - step 5') {
            localStorage.setItem(request.name, request.value);
        }
    });
    
    // Example contentscript.js
    chrome.runtime.sendMessage({
        type: 'localStorage - step 4',
        name: 'preference'
    }, function(value) {
        if (value === null) {
            // Example: If no preference is set, set one:
            chrome.runtime.sendMessage({
                type: 'localStorage - step 5',
                name: 'preference',
                value: 'default'
            });
        }
    });
    

    See also

    • SO: What you should know about background scripts vs Content Scripts vs Injected scripts.
    • SO: Example code: Communicating between an Injected script and a Content script.
    0 讨论(0)
提交回复
热议问题