chrome插件的popup与跨域请求
来源:互联网 发布:柳天捏脸数据 编辑:程序博客网 时间:2024/06/07 06:08
chrome插件的popup与跨域请求
tkorays <tkorays@hotmail.com>
popup及其他js脚本
在chrome插件开发中,大致有几种类型的js文件:popup窗口的js文件,background脚本,content脚本。
- popup即指弹出窗口,里面的页面是使用html等定义的。这个页面里面包含脚本,主要用于popup界面逻辑,但是它也可以调用chrome的一些API,比如和background通信。
- background是用于处理后台功能的,比如处理一些计算、分析页面等。
- content是嵌入打开的页面的,利用它可以修改浏览页面的样式功能、得到页面的DOM等。
他们三个之间是可以相互通信的,chrome提供了一些通信的方法:
chrome.extension.*
chrome.runtime.*
跨域请求
由于安全问题,chrome禁止了跨域请求的。在某些场景中,我们需要在popup的脚本中发送跨域请求,但是在chrome中执行,返回的status总是为0 。这样很不方便。
但是在插件中,background脚本是可以执行跨域请求的。
content脚本中也可以请求,但是必须先设置manifest.json里的permissions,开启对某些地址的跨域请求。
这里有一些解决方案。
1.利用通信
popup发送消息,background执行跨域请求,返回信息。但是,这里有个问题,popup里面的发送消息时回调函数并没有执行(content和background通信中执行没问题)。但是我们需要在收到消息后执行某些操作。因此,这样问题很大。
popup发送消息,background执行跨域请求,返回信息。但是,这里有个问题,popup里面的发送消息时回调函数并没有执行(content和background通信中执行没问题)。但是我们需要在收到消息后执行某些操作。因此,这样问题很大。
2.调用background函数
其实,还有种最简单的方法,那就是直接调用background的函数。因为,popup里面可以获取background:
var bgPage = chrome.extension.getBackgroundPage();
只要调用函数bgPage.someFunc();就可以使用background的功能了。
比如你在background里面实现函数:
DownloadPage(url,callback){ var content = ""; // 下载代码,可以跨域请求 // ....... callback(content);};
在popup里面调用:
bgPage.DownloadPage('http://www.baidu.com',function(content){ // 在这个回调函数里面改变popup内容等});
0 0
- chrome插件的popup与跨域请求
- Chrome插件:content与background,popup之间的消息传递
- chrome插件开发:content、background和popup三者之间的通信
- 网页调试与发送网页HTTP请求的Chrome插件---Postman
- Postman - 网页调试与发送网页HTTP请求的Chrome插件
- Chrome插件中 popup,background,contantscript消息传递机制
- Chrome插件:拦截页面请求
- chrome跨域请求注意事项
- chrome与firefox不错的插件介绍
- JQuery.fn.Popup 与 JQuery.Popup的区别
- chrome调试ajax 跨域请求
- 使用chrome extensions跨域请求
- chrome解决跨域(CORS)问题---chrome插件
- chrome解决跨域(CORS)问题---chrome插件
- chrome解决跨域(CORS)问题---chrome插件
- chrome的Emacs插件
- chrome的vim插件
- chrome的post插件
- zlib库剖析(4):使用示例example.c
- 谷歌前员工一语道破皮查伊和佩奇最大不同点
- 程序猿之-创业执行力
- AIR 15.0 提交 APPSTORE 错误 ERROR ITMS-9000: INVALID SEGMENT ALIGNMENT
- 10月份的工作记录
- chrome插件的popup与跨域请求
- 求职篇-带我装逼,带我飞
- 小学到初三的全部概念!
- iOS学习爬坑记录1:为什么Xcode6中Storyboard变成了正方形?
- 运行Android项目时指定特定的AVD进行测试
- distinct的用法
- 计算集合 常用算法模版!!!
- KNN算法简述
- baidumapsdk错误“”Authentication Error errorcode: 102 uid: null appid -1 msg: IP/SN/SCODE/REFERER Illeg