Squeak.ru - шаблоны программирования

Перехват URL-адресов на основе шаблонов с расширением Chrome

Сценарий:

  • фильтровать некоторые URL-адреса перенаправления на основе шаблонов
  • Показать сообщение о том, что URL-адрес был заблокирован из-за перенаправления
  • "разблокировать" запрос на той же вкладке, если предыдущий запрос был заблокирован

Мой список шаблонов URL для использования в webRequest.onBeforeRequest содержит bit.ly. Затем я нажимаю URL-адрес bit.ly/2qlHCT, который перенаправляет на google.com. В этом случае я покажу сообщение типа «запрос был заблокирован», но я не хочу фактически блокировать запрос, возвращая { cancel: true } в обратном вызове onBeforeRequest.

Если пользователь попытается нормально получить доступ к google.com в той же вкладке, то я покажу сообщение «ничего не было заблокировано». Итак, это похоже на то, что делает Adblock, когда вы добавляете фильтры для определенного домена. Значок Adblock становится зеленым, если домен разрешен, в противном случае он становится красным.

Я знаю, что могу использовать chrome.storage для сохранения информации о заблокированном запросе, но как этого добиться, если шаблон URL не совпадает?

javascript google-chrome google-chrome-extension adblock
26.05.2017

  • Когда он не соответствует, страница загружается нормально, поэтому все, что вам нужно, это прослушиватель любого события, которое происходит позже, например, onHeadersReceived или webNavigation.onCompleted и так далее. 26.05.2017
  • Я пробовал это, но я обернул методы get и set chrome.storage в Promises, чтобы избежать ошибок chrome.runtime. Итак, я имею дело с асинхронными функциями внутри функции синхронизации (onBeforeRequest). По сути, я хочу знать, звонили ли моему слушателю. 27.05.2017
  • Это не имеет значения для идеи, которую я предложил. В любом случае, без кода на этот вопрос вряд ли можно будет ответить. 27.05.2017
  • Мне все еще нужно заблокировать вкладку, пока пользователь не начнет новую навигацию из другого домена. Если bit.ly/2qlHCT перенаправляет на google.com, вкладка должна оставаться заблокированной, если пользователь что-то ищет в Google. 29.05.2017

Ответы:


1

Решение было действительно простым. Я использовал chrome.tabs.query для блокировки вкладок, но это асинхронный метод, и мне нужен ответ синхронизации. Использование localStorage помогло.

function blockRequest(tabId) {
  let tabs = localStorage.blocked_tabs;
  tabs = (tabs !== undefined) ? JSON.parse(tabs) : [];
  tabs = tabs.filter(function (item) {
    return item !== tabId;
  });
  localStorage.setItem('blocked_tabs', JSON.stringify(tabs));
}

Затем я просто добавил функцию blockRequest в качестве слушателя для chrome.webRequest.onBeforeRequest и несколько фильтров.

chrome.webRequest.onBeforeRequest.addListener(blockRequest, { urls: filters, types: ['main_frame'] });
18.07.2017
Новые материалы
Угловая структура архитектуры
Обратите внимание, что эта статья устарела, я решил создать новую с лучшей структурой и с учетом автономных компонентов: https://medium.com/@marekpanti/angular-standalone-architecture-b645edd0d54a..
«Данные, которые большинство людей используют для обучения своих моделей искусственного интеллекта, поставляются со встроенным…
Первоначально опубликовано HalkTalks: https://hacktown.com.br/blog/blog/os-dados-que-a-maioria-das-pessoas-usa-para-treinar-seus-modelos-de-inteligencia-artificial- ja-vem-com-um-vies-embutido/..
Сильный ИИ против слабого ИИ: различия парадигм искусственного интеллекта
В последние годы изучению и развитию искусственного интеллекта (ИИ) уделяется большое внимание и прогресс. Сильный ИИ и Слабый ИИ — две основные парадигмы в области искусственного интеллекта...
Правильный способ добавить Firebase в ваш проект React с помощью React Hooks
React + Firebase - это мощная комбинация для быстрого и безопасного создания приложений, от проверки концепции до массового производства. Раньше (знаете, несколько месяцев назад) добавление..
Создайте API с помощью Python FastAPI
Создание API с помощью Python становится очень простым при использовании пакета FastAPI. После установки и импорта вы можете создать приложение FastAPI и указать несколько конечных точек. Каждой..
Веселье с прокси-сервером JavaScript
Прокси-серверы JavaScript — это чистый сахар, если вы хотите создать некоторую общую логику в своих приложениях, чтобы облегчить себе жизнь. Вот один пример: Связь клиент-сервер Мы..
Получить бесплатный хостинг для разработчиков | Разместите свой сайт за несколько шагов 🔥
Статические веб-сайты — это веб-страницы с фиксированным содержанием и его постоянным содержанием. Но теперь статические сайты также обрабатывают динамические данные с помощью API и запросов...