Я в настоящее время строю расширение js chrome, и для этого мне нужно отказаться от данных с некоторых сайтов.
Итак, основываясь на этом вопросе SO, я обнаружил, что могу достичь этого, используя запрос с Browserify.
Я установил оба npm
с использованием npm
и создал фрагмент browserify.js
для создания моего файла bundle.js
(потому что для разрешений причины запуска команд терминала не работают), поэтому я могу запустить Node js
require
в клиенте, в моем браузере.
Итак, мне наконец удалось создать файл bundle.js
и попытался запустить его на моем локальном сервере, но он продолжает давать мне ошибку CORS и не возвращает желаемый ответ:
Fetch API не может загрузить https://somesite/index.html. В запрошенном ресурсе нет заголовка "Access-Control-Allow-Origin". Происхождение ' http://localhost: 8080 ', следовательно, не допускается. Если непрозрачный ответ отвечает вашим потребностям, установите режим запроса "no-cors" для извлечения ресурса с отключенным CORS.
Странно, что если я запустил "разделенный" файл напрямую с терминала с помощью node
:
$ node myFileWithRequires.js
Он работает так, как предполагалось, возвратил скомпилированные данные.
Что я делаю неправильно? Как я могу обменивать данные на клиенте с помощью request
и browserify
?
КОД:
myBrowserifySnippet.js
var browserify = require('browserify');
var b = browserify();
b.add('myrequest.js');
const fs = require('fs');
const writable = fs.createWriteStream('bundle.js');
b.bundle().pipe(writable);
myFileWithRequires.js
var request = require('request');
request('http://www.google.com', function (error, response, body) {
console.log('error:', error); // Print the error if one occurred
console.log('statusCode:', response && response.statusCode); // Print the response status code if a response was received
console.log('body:', body); // Print the HTML for the Google homepage.
});
По умолчанию запросы XHR и fetch
связаны с CORS, а это означает, что они не могут получить доступ к ресурсам в других доменах, если только эти домены не переименовывают "источник" (текущий домен страницы). request
в браузере использует XHR, поэтому он также связан CORS.
В расширениях Chrome это немного отличается - вы можете настроить расширение, чтобы CORS не применимо к некоторым доменам. См. Раздел "Требование разрешения перекрестного происхождения" в документации по расширению хрома.
Вам нужно добавить поле permissions
на расширение manifest.json
:
{
"permissions": [
"http://www.google.com/"
]
}
Если вы не знаете заранее, какой домен вы будете очищать, вы можете использовать подстановочный знак:
{
"permissions": [
"http://*/",
"https://*/"
]
}
request
на клиенте.request
слишком тяжелый (> 1 МБ). Вместо этого пакетxhr
реализует подмножество API запросов, используяXMLHttpRequest
. Предназначен для использования с browserify.somesite
, а не с запросом.somesite
не разрешает поступать запросы с другого сайта, и браузеры уважают это.