На основании примеров в "Изменения в перекрестных запросах в скриптах содержимого расширений Chrome" я заменил все вызовы fetch
новым методом fetchResource
, который имеет аналогичный API,но делегирует вызов fetch
на фоновую страницу:
// contentScript.js
function fetchResource(input, init) {
return new Promise((resolve, reject) => {
chrome.runtime.sendMessage({input, init}, messageResponse => {
const [response, error] = messageResponse;
if (response === null) {
reject(error);
} else {
// Use undefined on a 204 - No Content
const body = response.body ? new Blob([response.body]) : undefined;
resolve(new Response(body, {
status: response.status,
statusText: response.statusText,
}));
}
});
});
}
// background.js
chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
fetch(request.input, request.init).then(function(response) {
return response.text().then(function(text) {
sendResponse([{
body: text,
status: response.status,
statusText: response.statusText,
}, null]);
});
}, function(error) {
sendResponse([null, error]);
});
return true;
});
Это наименьший набор изменений, которые я смог внести в свое приложение, чтобы исправить проблему.(Обратите внимание, что расширения и фоновые страницы могут передавать между ними только JSON-сериализуемые объекты, поэтому мы не можем просто передать объект ответа Fetch API с фоновой страницы на расширение.)
На фоновые страницы не влияет CORS илиCORB, поэтому браузер больше не блокирует ответы от API.