Может ли посещаемый мной сайт иметь доступ к глобальной переменной, добавленной расширением Chrome?

Question

Допустим, у меня есть расширение Chrome, добавляющее JS-код на каждую посещаемую страницу (это довольно часто встречается в content_scripts):

{
    "name": "...",
    "content_scripts": [
        {
            "js": ["run.js"],
            "matches": ["http://*/*", "https://*/*"],
            "run_at": "document_end"
        }
    ]
    ...
}

Допустим, у run.js есть глобальная templates переменная:

var templates = {0: 'hello world', 1: 'bye bye'}; // default templates

chrome.storage.sync.get("templates", function(obj) {
    templates = obj.templates;
});

document.addEventListener("keydown", function(e) {
    // add template to textarea if a specific key is pressed
}

Вопрос: Может ли посещаемый мной веб-сайт очистить все мои личные данные, хранящиеся в моих шаблонах (поскольку они находятся в глобальной переменной templates), и отправить их через AJAX на их сервер? Если это так как?

Или это невозможно, потому что между переменными content_scripts расширения Chrome и переменными страницы есть разделительная стена?

Answer 1

? Изолированные миры

Нет, контекстные скрипты находятся в изолированной программной среде и могут обращаться только к DOM, так как вы можете прочитать в документации :

Сценарии содержимого живут в изолированном мире, позволяя сценарию содержимого вносить изменения в свою среду JavaScript, не конфликтуя со страницей или дополнительными сценариями содержимого.

Веб-сайт, который вы вводите run.js, не сможет получить доступ к templates.

На самом деле, даже если вы введете window.templates = templates в run.js, введенная страница получит undefined, если попытается получить к ней доступ.

?️ Практический пример

Допустим, у вас есть расширение Chrome, которое внедряет скрипт на активной в данный момент вкладке, когда вы нажимаете кнопку действия браузера, которая отображает всплывающее окно на странице. Если это всплывающее окно уже было введено ранее, вам нужно просто вызвать для него метод toggle.

Вы могли бы иметь что-то вроде этого в своем введенном сценарии:

import { Popup } from './components/popup.component';

const popup = window.POPUP;

if (popup) {
    popup.toggle();
} else {
    window.POPUP = new Popup();
}

Тогда:

• При первом внедрении window.POPUP в мире контекстных сценариев будет undefined, поэтому мы создадим новый экземпляр Popup и снова назначим его window.POPUP , в контексте скриптового мира.

• Во второй и последующие моменты, когда это вводится, window.POPUP в мире контекстных скриптов уже будет иметь значение, и мы просто назовем popup.toggle().

• Если скрипт на внедренной странице пытается получить доступ к window.POPUP в любое время, в своем собственном мире, он получит undefined.

• Если на внедренной странице было window.POPUP = true, сценарий содержимого все равно получит undefined при первом обращении к window.POPUP, так как эти два window.POPUP живут в отдельных мирах.