Расширение Chrome обнаруживает обновление поиска Google

Как мой сценарий содержимого может обнаружить обновление поиска Google? Я считаю, что это перезагрузка страницы AJAX, а не «настоящее» обновление, поэтому мои события не обнаружат обновление.

Можно ли как-то обнаружить его как в расширении Google Chrome, так и в надстройке Firefox WebExtensions?


person pila    schedule 02.09.2016    source источник


Ответы (1)


Поиск Google — это динамически обновляемая страница. Существует несколько известных методов обнаружения обновлений: MutationObserver, подход на основе таймера (см. оболочку waitForKeyElements) и событие, используемое сайтом, например pjax:end на Гитхабе.

К счастью, поиск Google в браузере Chrome использует событие message, так что вот наш скрипт контента:

window.addEventListener('message', function onMessage(e) {
    // console.log(e);
    if (typeof e.data === 'object' && e.data.type === 'sr') {
        onSearchUpdated();
    }
});

function onSearchUpdated() {
    document.getElementById('resultStats').style.backgroundColor = 'yellow';
}

Этот метод основан на недокументированной функции сайта, которая, например, не работает в Firefox.

Более надежный кроссбраузерный метод, доступный для расширений Chrome и WebExtensions, заключается в отслеживании изменений URL-адреса страницы, поскольку страница результатов поиска Google всегда обновляет свою хеш-часть URL. Нам понадобится фоновая/событийная страница, chrome.tabs.onUpdated и обмен сообщениями:

  • фон.js

    var rxGoogleSearch = /^https?:\/\/(www\.)?google\.(com|\w\w(\.\w\w)?)\/.*?[?#&]q=/;
    chrome.tabs.onUpdated.addListener(function(tabId, changeInfo, tab) {
        if (rxGoogleSearch.test(changeInfo.url)) {
            chrome.tabs.sendMessage(tabId, 'url-update');
        }
    });
    
  • контент.js

    chrome.runtime.onMessage.addListener(function(msg, sender, sendResponse) {
        if (msg === 'url-update') {
            onSearchUpdated();
        }
    });
    
    function onSearchUpdated() {
        document.getElementById('resultStats').style.backgroundColor = 'yellow';
    }
    
  • manifest.json: фоновая страница/страница событий и скрипт содержимого объявления, "tabs" разрешение.

person wOxxOm    schedule 02.09.2016
comment
а есть что-нибудь для фаерфокса? при реализации этого события функция никогда не срабатывает. я думаю, что объект сообщения не содержит указанные ключи в операторе if. но как это возможно? Извините за ОТ - person pila; 02.09.2016