Request.js与Browserify无法正常工作

我目前正在构build一个js chrome扩展,为此,我需要从一些站点中删除数据。

所以,基于这个SO问题,我发现我可以通过使用Browserify 请求来实现这一点 。

我安装了两个使用npm和创build一个bundle.js片段创build我的bundle.js文件( 因为权限的原因,运行terminal命令不起作用 ),所以我可以在客户端,我的浏览器运行Node js require

好的,所以我最终设法创build了bundle.js文件,并试图在我的本地服务器上运行它,但它一直给我CORS错误,并且不返回所需的响应:

抓取API无法加载https://somesite/index.html 。 请求的资源上没有“Access-Control-Allow-Origin”标题。 原因' http:// localhost:8080 '因此不被允许访问。 如果一个不透明的响应满足您的需求,请将请求的模式设置为“no-cors”来取消禁用CORS的资源。

奇怪的是,如果我使用node从terminal直接运行“unbundled”文件:

 $ node myFileWithRequires.js 

它按预期工作,返回报废的数据。

我究竟做错了什么? 我怎样才能使用request和浏览器在客户端的数据?

码:

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绑定,这意味着除非这些域将“origin”(当前页面的域)列入白名单,否则它们将无法访问其他域上的资源。 在浏览器中request使用XHR,所以它也被CORS绑定。

在Chrome扩展中,它有点不同 – 您可以configuration您的扩展,以便CORS不适用于某些域。 请参阅chrome扩展文档中的重新授予跨域权限 。

您需要向您的扩展manifest.json添加permissions字段:

 { "permissions": [ "http://www.google.com/" ] } 

如果您不确定哪个域名可能会被抓取,可以使用通配符:

 { "permissions": [ "http://*/", "https://*/" ] }