Ошибка в обработчике событий: ReferenceError: окно не определено расширением Chrome с помощью Menifest v3

Я использую версию манифеста 3 для расширения Chrome, эта ошибка, с которой я сталкиваюсь в фоновом режиме js: Ошибка в обработчике событий: ReferenceError: окно не определено расширение Chrome с помощью Menifest v3

"manifest_version":3,"permissions":["contextMenus","storage", "activeTab","tabs","scripting","webRequest"],

var posLeft = ( window.width - winWidth ) / 2 ;

Источник

3 ответа

Расширение ManifestV3 использует сервис-воркер, поэтому у него нет DOM или window. Надеемся, что будет реализован альтернативный API, нажмите звездочку в https://crbug.com/1180610.

В качестве обходного пути вы можете открыть свернутое окно, прочитать там размер экрана, а затем изменить его размер.

  1. Страница расширения

    вспомогательный работник службы:

            chrome.windows.create({url: 'hello.html', state: 'minimized'});

    hello.html:

            <head>
  <script src=hello.js></script>

    hello.js:

            resizeWindow(chrome.windows.WINDOW_ID_CURRENT, 500, 300);
function resizeWindow(id, w, h) {
  chrome.windows.update(id, {
    left: (screen.availWidth - w) / 2,
    top: (screen.availHeight - h) / 2,
    width: w,
    height: h,
    state: 'normal',
  });
}

  2. страница в Интернете

    manifest.json:

            {
  "content_scripts": [{
    "matches": ["*://*.your.web.url/*"],
    "js": ["content.js"],
    "run_at": "document_start"
  }],

    content.js:

            chrome.runtime.sendMessage({
  type: 'screenSize',
  w: screen.availWidth,
  h: screen.availHeight,
});
document.addEventListener('DOMContentLoaded', () => {
  // process the page here
}, {once: true});

    вспомогательный работник службы:

            chrome.windows.create({url: 'https://your.web.url', state: 'minimized'}, wnd => {
  chrome.runtime.onMessage.addListener(function onMessage(msg, sender) {
    if (msg.type === 'screenSize' && sender.tab?.id === wnd.tabs[0].id) {
      chrome.runtime.onMessage.removeListener(onMessage);
      const width = 500, height = 300;
      chrome.windows.update(wnd.id, {
        width,
        height,
        left: (msg.w - width) / 2,
        top: (msg.h - height) / 2,
        state: 'normal',
      });
    }
  })
});
Источник

Если вы пытаетесь получить доступ к оконному объекту в background.js, поскольку он является сервисным работником, у вас не будет доступа к оконному объекту, но вы можете попробовать себя, так как он будет иметь все свойства оконного объекта вbackground.jsпытаться

      console.log(self,"self")
var window = window ?? self;

Note: if you are using Vite or Webpack this might work

Источник

Что ж, для других, кто может искать здесь это сообщение об ошибке в аналогичном контексте, я получил ту же ошибку, когда пренебрегал доступностью объекта во время выполнения, а не в то время, когда внедренная функция динамически готовится для инъекции в конкретную вкладку с помощью фоновый скрипт v3.

Чтобы динамически внедряться из фонового скрипта v3, объект, специфичный для вкладки (в данном случае window) необходимо включить в передаваемую функцию, как в следующем случае анонимной функции:

      chrome.scripting.executeScript({
    target: { tabId: currentTab.id },
    func: () => window.history.back()
  });

если window.history.back предоставляется как значение для func тогда очевидно, что фоновый скрипт не узнает об этом или не будет его использовать, и появится то же сообщение об ошибке.

Это уже действительно описано в документации.

Источник
Другие вопросы по тегам