Перехват запросов посредством «JS» в «Chrome»?

Question

[demon1806]

Добрый день. Может кто-нибудь подсказать, как можно сделать перехват запросов посредством JS в "Chrome" ?
Например, чтобы на любой запрос на какой-то или на все сайты мне возвращалась строка "this is a response constructed by VPN extension".

Answer 1

[Somewhere Intech]

Если я правильно понял, что у Вас свой extension, то:
Отредактируйте манифест добавив к permissions "webRequest"

"permissions": [
          "webRequest"
          // other permissions

До отправки запроса его можно отменить:

chrome.webRequest.onBeforeRequest.addListener(
        function(details) {
          if (details.url.indexOf("://white.listed.site")) console.log("this is a response constructed by VPN extension");
          return {cancel: details.url.indexOf("://www.evil.com/") != -1}; // если нужно отменить запрос
        },
        {urls: ["<all_urls>"]},
        ["blocking"]);

Также можно повесить onComplete

chrome.webRequest.onCompleted.addListener(function(details){
    console.log(`Catch ${details.method} response from ${details.url} ${details.fromCache ? ' [ from cache ]' : ''} `)
}

Comments

[demon1806]

Попробовал вставить Вашу реализацию, но ничего не сработало... Возможно, я что-то неправильно понял, но не могли бы сюда скинуть весь проект, дабы я понял, в чём где-то ошибся ? В крайнем случае имеется ли аккаунт на каком-нибудь репозитории, закинул бы туда свой проект для взятия контроля над ситуацией? И ещё: "Куда вешается onComplete?"

[Somewhere Intech]

demon1806, Отредактируйте манифест добавив к permissions "webRequest"

"permissions": [
          "webRequest"
          // other permissions

onComplete:

chrome.webRequest.onCompleted.addListener(function(details){
    console.log(`Catch ${details.method} response from ${details.url} ${details.fromCache ? '[ from cache ]' : ''} `)
}

[demon1806]

Johnny Lowhunter, у меня почему-то в итоге не работает... Я правильно написал код или нет ?
{

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

"permissions": [
"webRequest",
"webRequestBlocking",
""
],

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

}

chrome.webRequest.onBeforeRequest.addListener(
function(details) {
if (details.url.indexOf("://white.listed.site")) console.log("this is a response constructed by VPN extension");
return {cancel: details.url.indexOf("://www.evil.com/") !== -1}; // если нужно отменить запрос
},
{urls: ["<all_urls>"]},
["blocking"]);

chrome.webRequest.onCompleted.addListener(function(details){
console.log(`Catch ${details.method} response from ${details.url} ${details.fromCache ? '[ from cache ]' : ''} `)
},
{
urls: ["<all_urls>"]
});

[Somewhere Intech]

У меня работает. В манифесте специально не указали маску разрешенных урл?
manifest.json

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

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

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

background.js

chrome.webRequest.onBeforeRequest.addListener(
	function(details) {
		if (details.url.indexOf("://white.listed.site")) console.log("this is a response constructed by VPN extension");
		return {cancel: details.url.indexOf("://www.evil.com/") !== -1}; // если нужно отменить запрос
	},
	{urls: ["<all_urls>"]},
	["blocking"]
);

chrome.webRequest.onCompleted.addListener(
	function(details){
		console.log(`Catch ${details.method} response from ${details.url} ${details.fromCache ? '[ from cache ]' : ''} `)
	},
	{
		urls: ["<all_urls>"]
	}
);

[demon1806]

Johnny Lowhunter, я всё сделал, как у Вас указано, но почему-то оно не так работает... Возможно, я что-то другое ожидал на выходе((( Вы не могли бы, если нетрудно, сказать, что именно должно получиться на выходе или хотя бы прислать скриншот с результатом как-нибудь ? Вообще я неправильно понял суть задания: "В идеале мне сейчас необходимо, чтобы на любой запрос в "Google" выходила страница, где будет написана строка "this is a response constructed by VPN extension". Вы не могли бы и с этим, если что, помочь ?

[Somewhere Intech]

demon1806, Давайте уточним, Вам нужно расширение для Google Chrome, логика его работы:
При любом запросе к google.com открывать страницу, содержание которой будет "this is a response constructed by VPN extension". Но, в этом случае таких страниц будет куча просто, в примере выше учитываются не только загрузка сайта но и xhr запросы.
Если же нужно отлавливать только переходы на сайт google, то web request тут ни к чему, достаточно crhome.tabs.onUpdated

[demon1806]

Johnny Lowhunter, а как именно это можно реализовать, Вы не подскажите случаем ?