@Nightmarr13

Как получить ответы на запросы сторонних скриптов в js?

Пуcть есть некий сайт, скрипты на сайте отправляют на сервер запросы, затем обрабатывают ответ, генерируя контент на странице.. Но используются не все данные из ответа, а я бы хотел их использовать.
К коду сайта доступа у меня нет. Запросы я вижу во вкладе Network панели разработчика, но с этими данными ничего сделать не могу.
Я хочу использовать собственный js, который внедряется в страницу браузера, к примеру, как расширение chrome, получить данные из этих запросов, обработать их и модифицировать контент на странице, добавив нужную мне информацию в нужном мне виде.
Короче говоря суть в перехвате response Fetch/XHR на стороне клиента.

Подскажите, что изучить, в каком направлении двигаться?
  • Вопрос задан
  • 668 просмотров
Пригласить эксперта
Ответы на вопрос 1
zkrvndm
@zkrvndm
Архитектор решений
Делать браузерное расширение не обязательно, вы можете запускать свой код сразу в консоли Ctrl + Shift + J и это не потребует установки никаких расширений. Либо вы можете использовать готовое расширение, например:
https://chrome.google.com/webstore/detail/custom-j...

Кроме расширений, таких как выше, также можно использовать блокировщики рекламы. Казалось бы причем тут блокировщики рекламы? Ну просто это их базовый функционал, многие блокировщики рекламы из под коробки позволяют на сторонних сайтах запускать свой код, это называется UserScript или пользовательские скрипты:
https://kb.adguard.com/ru/general/userscripts

Насчет того, как именно перехватывать запросы на чужом сайте... для этого на самом деле достаточно заменить метод window.XMLHttpRequest своей собственной функцией, это фактически позволит перехватывать все запросы выполненные посредством XMLHttpRequest, аналогично дела обстоят и c fetch.

Замена родных нативных методов браузера своими собственными называется манкипатчем:
https://yandex.ru/search/?text=XMLHttpRequest+fetc...

Пример простейшего манкипатча:
var original = {
	open: XMLHttpRequest.prototype.open,
	send: XMLHttpRequest.prototype.send
};

XMLHttpRequest.prototype.open = function (method, url, async, user, password) {
	console.log('Инициируется запрос:', method, url);
	return original.open.call(this, method, url, async, user, password);
};

XMLHttpRequest.prototype.send = function (data) {
	console.log('Отправляются данные:', data);
	return original.send.call(this, data);
};
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы