最近使用谷歌插件抓取某网页的数据时,通过修改XMLHttpRequest原型的方式拦截到了数据,但是我希望我的数据可以不通过后端直接传输到我的网站上。刚开始尝试过通过injectjs中使用windows.postMessage()来实现跨域通讯,但是效果并不理想,可能是改变了postmessage的某些属性,所以,在处理网页在load状态时发送的消息可以正常传递到我的网页,但是在加载完成之后就不能通过postmenssage继续实现跨域发送消息的状态。所以可能需要另辟蹊径。
chrome.tabs
在chrome for development 中,对于chrome.tabs的介绍是这样的:
使用 chrome.tabs API 与浏览器的标签页系统进行交互。您可以使用此 API 在浏览器中创建、修改和重新排列标签页
但是我们可以在api文档中发现,他拥有sendMessage()方法,官方介绍如下:
官方给出的解释是会触发到内容脚本中的message事件,也就是说,我们是触发到注入到自己网站中的content.js,而我们可以通过content.js使用postMessage来转发我们想要的数据到我们自己的网站中,从而为自己所用。
我们可能需要准备两个content.js,因为对两边注入的js需求并不同,在第三方网站注入a.js,在自己的网站中注入b.js,在a.js中将我们捕获到的数据进行转发到background中,在通过chrome.tabs.sendMessage进行转发,而在b.js中,我们则可以通过chrome.runtime.onMessage来监听我们由background所转发的消息,而b.js是注入到我们自己网站中的js,那么,此时通过b.js使用postMessage进行转发,我们就通过window.onMessge来接收到我们需要的第三方网站的数据,从而实现自己的功能