黄聪:360、chrome开发插件扩展如何跨域调用其他网站的信息并且显示在扩展、tab中的api
chrome插件提供了查找tab的api
- chrome.tabs.get(integer tabId, function callback)
但是出于安全的考虑,tab的属性中没有document
因此无法在扩展中直接获取某个页签页面中的页面元素
但是tab有这样一个方法
- chrome.tabs.sendRequest(integer tabId, any request, function responseCallback)
他可以在扩展中可以对某一个tab进行请求,发送请求信息;
在对应的tab页面中通过
- chrome.extension.onRequest.addListener(function(any request, MessageSender sender, function sendResponse) {...});
对扩展中的请求进行监听,根据监听到的信息,决定要做的事情
简单一点的,简明实例:
一、在扩展中 添加 发送事件请求 的代码
- chrome.tabs.sendRequest(tab_id, {
- hello: "ok"
- }, function(response) {
- // tab做出响应,发来的response
- })
二、在 tab中添加 事件监听的代码
在manifest.json中添加
- "content_scripts": [
- {
- "matches": ["*://*/*"],
- "js": ["jquery.min.js","test.js"]
- }
- ],
- "permissions": ["*://*/*","tabs"]
其目的是在每个页签页面加载的时候同时载入这两个js,获取tabs的权限
在test.js 中放入监听 扩展 请求事件的代码
- chrome.extension.onRequest.addListener(
- function(request, sender, sendResponse) {
- if (request.hello == "ok"){ // 在得到request请求是ok的时候 做下面的操作
- sendResponse({
- data: $("#hello") // 获取id是hello的元素发过去
- });
- }
- }
- );
黄聪:360、chrome开发插件扩展如何跨域调用其他网站的信息并且显示在扩展、tab中的api的更多相关文章
- 黄聪:Jquery+DataTables插件,如何在ajax调用服务器数据后,自动给tr添加id属性
http://legacy.datatables.net/usage/callbacks#fnRowCallback 主要通过 fnCreatedRow 事件来实现 var table = $('#t ...
- js跨域调用mvc ActionResult扩展
背景 最近2个项目中都用到了js跨域访问的知识,2个项目都需要主站与各个分站之间进行数据交互.状态同步等相关操作.浏览器本身是不允许进行跨域访问,在MVC中我们可以扩展一个方法来实现这个功能.在此大家 ...
- [记录]js跨域调用mvc ActionResult扩展
背景 最近2个项目中都用到了js跨域访问的知识,2个项目都需要主站与各个分站之间进行数据交互.状态同步等相关操作.浏览器本身是不允许进行跨域访问,在MVC中我们可以扩展一个方法来实现这个功能.在此大家 ...
- 开发环境Vue访问后端接口教程(前后端分离开发,端口不同下跨域访问)
原理:开发环境下的跨域:在node.js上实现请求转发,vue前端通过axios请求到node.js上,node.js将请求转发到后端,反之.响应也是,先到node.js上,然后转发vue-cil项目 ...
- 黄聪:chrome扩展开发《AJAX请求》
chrome在一次更新之后,出于安全考虑,完全的禁止了content_script从https向http发起ajax请求,即使正常情况下也会在console里给出提示.这对于WEB来讲是好事,但对于扩 ...
- 利用Google Chrome开发插件,在网页中植入js代码
Google Chrome是一个很强大的浏览器,提供了各种各样的插件,大大提升了使用了的效率,比如vimium.honx等. Google在提供这些插件的同时还允许用户开发自己的插件. 最近在写js的 ...
- 黄聪:VS2010开发如何在c#中使用Ctrl、Alt、Tab等全局组合快捷键
1.新建一个类 HotkeyHelper using System; using System.Runtime.InteropServices; using System.Windows.Forms ...
- vue项目开发时怎么解决跨域
vue项目中,前端与后台进行数据请求或者提交的时候,如果后台没有设置跨域,前端本地调试代码的时候就会报“No 'Access-Control-Allow-Origin' header is prese ...
- 前后端分离跨域 关于前后端分离开发环境下的跨域访问问题(angular proxy=>nginx )
前后端分离后遇到了跨域访问的问题: angular1中使用proxy很麻烦,最后还是失败结束:最后总结3种方法如下: 本人使用的第一种方法,只是开发环境下使用很方便! 1:禁掉谷歌的安全策略(Turn ...
随机推荐
- YouCompleteMe自动补全的安装配置与使用
1 下载 git clone --recursive git://github.com/Valloric/YouCompleteMe 如果执行该命令没报错, 就ok了. 但是中途有可能会断掉, 可以 ...
- win10下安装lxml
最近在windows平台下开发,用的python3.6,安装lxml遇到点问题,现已解决.特意记下,以供以后再遇到. 解决方法: 1.打开cmd终端,查看pip版本,pip --version,如不是 ...
- CGI, FCGI, SCGI, WSGI 释异
IKI Links: CGI - http://en.wikipedia.org/wiki/Common_Gateway_Interface FCGI - http://en.wikipedia.or ...
- MySQL 5.7.17 Windows安装和启动
1.在官网http://dev.mysql.com/downloads/下载 MySQL Community Server 2.解压后是这个样子(5.7.18解压后没有my-default.ini文件 ...
- BZOJ 4012 【HNOI2015】 开店
题目链接:开店 这道题显然一眼树分治,维护点分的结构,在每个点上,对每种年龄到这个点\(u\)以及他在点分树上父亲的距离和建一棵线段树,查询的时候一路往上跳即可. 但是我太懒了(其实你要说我不会也可以 ...
- Flutter的需要与原生交互的一些常用库
[说明]由于这些库一直在更新,请自己选择合适的稳定版本下载. 另外如果发现有问题或者你有更好的库,欢迎留言告诉我. 谷歌官方的针对Dart语言的一些实用性的功能以及扩展的库 -- Quiver Qui ...
- Angular单元测试
https://angular.github.io/protractor/#/http://jasmine.github.io/2.4/introduction.html 测试程序有两种主要方法:端对 ...
- 配置Spring Boot通过@ConditionalOnProperty来控制Configuration是否生效
Spring boot中有个注解@ConditionalOnProperty,这个注解能够控制某个configuration是否生效. 具体操作是通过其两个属性name以及havingValue来实现 ...
- Zabbix SNMP OID discovery,自动发现
Unlike file system and network interface discovery, the item does not necessarily have to have “snmp ...
- 【hive】时间段为五分钟的统计
问题内容 今天遇到了一个需求,需求就是时间段为5分钟的统计.有数据的时间戳.对成交单量进行统计. 想法思路 因为数据有时间戳,可以通过from_unixtime()来获取具体的时间. 有了具体的时间, ...