Использование webNavigation.onCommitted для внедрения скрипта в веб-страницу - PullRequest
Новая
       33

Использование webNavigation.onCommitted для внедрения скрипта в веб-страницу

1 голос
/ 12 июля 2019

Я хочу найти способ внедрить элемент скрипта, как только DOM будет использоваться на веб-странице и до загрузки любого другого скрипта, в моем веб-расширении.

Я пытался добиться этого с помощью события webNavigation.onCommited , которое должно быть запущено when a navigation is committed. At least part of the new document has been received from the server and the browser has decided to switch to the new document. (цитирование ранее связанной страницы).

Дело в том,что к моменту внедрения сценария документ уже был проанализирован и обработан браузером, поэтому объекты, на которые я хочу ссылаться с точки зрения веб-страницы, еще не определены.

I 'Я тестировал только на Firefox, но мне сейчас не нужна поддержка других браузеров.

Я создал минимальный воспроизводимый пример.Весь источник может быть извлечен здесь .

По сути, в фоновом скрипте я регистрирую свой обработчик событий, который внедряет скрипт содержимого во вкладку «Commit»: 

browser.webNavigation.onCommitted.addListener(details => {
  browser.tabs.executeScript(
    details.tabId,
    {
      'file': 'inject.js',
      'runAt': 'document_start'
    })
  console.log(details)
})

В inject.js я создаю элемент script и присоединяю его к корню документа: 

const script = document.createElement('script')
script.src = browser.runtime.getURL('script.js')
script.onload = () => {
  console.log('injected')
}

console.log('injecting')
document.documentElement.appendChild(script)

0

script.js очень прост: 

TEST=1

Чтобы проверить расширениеЯ создал еще одну простую веб-страницу: 

<!doctype html>
<html>
  <head>
    <meta charset=utf-8>
    <title>Test</title>
    <script>
console.log('too late?', window.TEST ? 'no' : 'yes :\\')
    </script>
  </head>
</html>

Я ожидаю увидеть в консоли строку журнала 'слишком поздно?нет».Всегда бывает слишком поздно?да: \ ', за исключением нескольких случаев, таких как открытие веб-страницы в первый раз, закрытие вкладки, содержащей страницу, и ее восстановление (CTRL + SHIFT + T).Обновление страницы (F5, CTRL + F5, что угодно) всегда приводит к «слишком поздно»?да: \ '

Ответы [ 2 ]

0 голосов
/ 18 июля 2019

Я хочу найти способ внедрить элемент скрипта, как только DOM будет использоваться на веб-странице и до того, как какой-либо другой скрипт будет загружен, в мое веб-расширение.

После использования DOM встроенные сценарии уже загружены и удаленные сценарии уже начали загружаться. Используйте content_scripts , чтобы добавить его в "document_start"

"content_scripts": [
  {
    "matches": ["*://*.mozilla.org/*"],
    "js": ["inject.js"],
     "run_at": "document_start"
  }
]

В "inject.js" добавить beforescriptexecute слушатель, например: document.addEventListener("beforescriptexecute", starting, true); (поддерживается только Firefox)

Затем обработайте сценарии, прежде чем они будут выполнены.

Если вам нужно обработать DOM, вам также нужно добавить прослушиватель для DOMContentLoaded например: document.addEventListener('DOMContentLoaded', doSomething);

0 голосов
/ 12 июля 2019

Я не уверен, но думаю, что проблема может быть в extensionType RunAt, а не в тот момент, когда совершается событие:

"document_start": corresponds to loading. The DOM is still loading.

Это скорее всего сценарий будет введен. Поэтому я предполагаю, что нет способа достичь вашей цели.

...