Перехват HTTP-запросов

Чтобы узнать, как использовать webRequest для ведения журнала запросов, создайте новую папку с именем «requests». В этой папке создайте файл «manifest.json» и добавьте:

{
  "description": "Demonstrating webRequests",
  "manifest_version": 2,
  "name": "webRequest-demo",
  "version": "1.0",

  "permissions": [
    "webRequest",
    "<all_urls>"
  ],

  "background": {
    "scripts": ["background.js"]
  }
}

Далее, создайте файл «background.js» и добавьте:

function logURL(requestDetails) {
  console.log(`Loading: ${requestDetails.url}`);
}

browser.webRequest.onBeforeRequest.addListener(
  logURL,
  {urls: ["<all_urls>"]}
);

Вы используете onBeforeRequest для вызова функции logURL() непосредственно перед началом запроса. Функция logURL() извлекает URL-адрес запроса из объекта события и записывает его в консоль браузера. Шаблон {urls: ["<all_urls>"]} шаблона означает, что вы перехватываете HTTP-запросы для всех URL-адресов.

Для проверки:

• Установите расширение
• Откройте Консоль браузера (используйте Ctrl + Shift + J)
• Включите Показать сообщения контента в меню:
• Откройте несколько веб-страниц.

В консоли браузера вы должны увидеть URL-адреса всех ресурсов, которые запрашивает браузер. Например, на этом снимке экрана показаны URL-адреса, загружаемые при загрузке страницы Википедии:

Теперь используйте webRequest для перенаправления HTTP-запросов. Сначала замените «manifest.json» этим:

{

  "description": "Demonstrating webRequests",
  "manifest_version": 2,
  "name": "webRequest-demo",
  "version": "1.0",

  "permissions": [
    "webRequest",
    "webRequestBlocking",
    "https://developer.mozilla.org/"
  ],

  "background": {
    "scripts": ["background.js"]
  }

}

Изменения:

• Добавьте webRequestBlocking permission. Это дополнительное разрешение необходимо, когда расширение хочет изменить запрос.
• Замените разрешение <all_urls> на индивидуальные разрешения на уровне хоста, так как это хорошая практика для минимизации количества запрашиваемых разрешений.

Далее, замените «background.js» на это:

let pattern = "https://developer.mozilla.org/*";
const targetUrl = "https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Your_second_WebExtension/frog.jpg";

function redirect(requestDetails) {
  console.log(`Redirecting: ${requestDetails.url}`);
  if (requestDetails.url === targetUrl) {
    return;
  }
  return {
    redirectUrl: targetUrl
  };
}

browser.webRequest.onBeforeRequest.addListener(
  redirect,
  {urls:[pattern], types:["image"]},
  ["blocking"]
);

Снова используйте обработчик событий onBeforeRequest для выполнения функции непосредственно перед выполнением каждого запроса. Эта функция заменяет redirectUrl целевым URL-адресом, указанным в функции. В данном случае — изображение лягушки из вашего второго учебного руководства по веб-расширениям.

На этот раз вы не перехватываете все запросы: опция {urls:[pattern], types:["image"]} указывает, что вы перехватываете только запросы (1) к URL-адресам, находящимся под "https://developer.mozilla.org/", и (2) к ресурсам изображения. См. webRequest.RequestFilter для получения дополнительной информации.

Также обратите внимание, что вы передаете опцию "blocking": вы должны передавать её, когда хотите изменить запрос. Это заставляет функцию обработчика заблокировать сетевой запрос, поэтому браузер ждёт, пока обработчик не вернёт данные, прежде чем продолжить. См. документацию webRequest.onBeforeRequest для получения дополнительной информации об "blocking".

Для проверки откройте страницу MDN, содержащую изображения (например, страницу, перечисляющую компоненты пользовательского интерфейса расширений), перезагрузите расширение, а затем перезагрузите страницу MDN. Вы увидите что-то вроде этого:

Наконец, используйте webRequest для изменения заголовков запросов. В этом примере вы изменяете заголовок «User-Agent», чтобы браузер определял себя как Opera 12.16, но только при посещении страниц по адресу "http://useragentstring.com/".

Обновите «manifest.json», чтобы добавить http://useragentstring.com/ так:

{
  "description": "Demonstrating webRequests",
  "manifest_version": 2,
  "name": "webRequest-demo",
  "version": "1.0",

  "permissions": [
    "webRequest",
    "webRequestBlocking",
    "http://useragentstring.com/"
  ],

  "background": {
    "scripts": ["background.js"]
  }
}

Замените «background.js» кодом, подобным этому:

let targetPage = "http://useragentstring.com/*";

let ua = "Opera/9.80 (X11; Linux i686; Ubuntu/14.10) Presto/2.12.388 Version/12.16";

function rewriteUserAgentHeader(e) {
  e.requestHeaders.forEach((header) => {
    if (header.name.toLowerCase() === "user-agent") {
      header.value = ua;
    }
  });
  return {requestHeaders: e.requestHeaders};
}

browser.webRequest.onBeforeSendHeaders.addListener(
  rewriteUserAgentHeader,
  {urls: [targetPage]},
  ["blocking", "requestHeaders"]
);

Вы используете обработчик событий onBeforeSendHeaders для выполнения функции непосредственно перед отправкой заголовков запроса.

Обработчик вызывается только для запросов к URL-адресам, соответствующим targetPage шаблону. Также обратите внимание, что вы снова передаёте "blocking" в качестве параметра. Вы также передаёте "requestHeaders", что означает, что обработчику передаётся массив, содержащий ожидаемые заголовки запроса. См. webRequest.onBeforeSendHeaders для получения дополнительной информации об этих параметрах.

Функция обработчика ищет заголовок «User-Agent» в массиве заголовков запроса, заменяет его значение значением переменной ua, и возвращает изменённый массив. Этот изменённый массив отправляется на сервер.

Для проверки откройте useragentstring.com и убедитесь, что браузер определяется как Firefox. Затем перезагрузите расширение, перезагрузите useragentstring.com и убедитесь, что Firefox теперь определяется как Opera.

Чтобы узнать обо всех возможностях API webRequest, обратитесь к его документации.