文档章节

谷歌浏览器插件开发详解

永不止步0929
 永不止步0929
发布于 2016/12/06 15:03
字数 472
阅读 27
收藏 2

 

      chrome 插件: 就是一个html + js +css + image的一个web应用 ;不同于普通的web应用, chrome插件除了兼容普通的js,json,h5等api,还可以调用一些浏览器级别的api,例如收藏夹,历史记录cookie等 以及js页面间的消息传递

注:每一个插件都有一个唯一的插件号

1.创建配置文件manifest.json文件

{

"name": "永不止步",     //插件名称
"version": "1.0",          //必填,版本号
"manifest_version": 2,     //必填,
"description": "*********永不止步*********",

"icons": {                  //图标
            "48": "icon.png",
            "16": "icon.png"
        },

//浏览器弹窗 
"browser_action": {
    "default_icon": "icon.png",    //图标
    "default_popup": "test.html"   //点击弹出来的窗口
},
"permissions": [           //插件的全新啊
"webNavigation",
"tabs",
"cookies",
"background",
"notifications",
"contextMenus",
"https://*/*",
"http://www.baidu.com/"          //服务器接收数据url
],
 "background": {                          //全局执行的js
 "scripts": ["eventPage.js","jquery-2.1.1.min.js"]
},
"content_scripts": [
{            
"matches": ["http://www.taobao.com/"],//抓取页面的url
"js": ["jquery-2.1.1.min.js", "contentscript.js"]     //定义抓取页面的js,可加多个
}
]

}

2.创建contentscript.js文件

①此文件可以通过DOM获取当前页面的所有元素,换句话说就是可以获取当前页面的所有内容,②也可以操作test.html(当然test.html必须先引入contentscript.js)。

③通过ajax将所需的数据传入后台服务器方式为json (必须在权限中将后台服务器url引入,否则会出现跨域问题)

 

 

常用的功能:

①通过chrome.cookies.get(details, function(cookie) {
                    //console.log(cookie);
                })

可以获取需请求后台的cookie信息,用于判断登陆。。。

 

②页面的消息传递

//发送消息

chrome.extension.sendMessage({cmd: "showPage"},function(response) {
      console.log("request:");

});

chrome.extension.sendMessage({cmd: "getPage"},function(response) {
        console.log("request:");
        // if(response.page){
        //     console.log("request:"+request.page);
        // }
    });

//接受消息   监听事件
chrome.extension.onMessage.addListener(
  function(request, sender, sendResponse) {
    totalPage = $(".J_Input").val();
    console.log("totalPage----------" + totalPage);
        console.log(request);
        if(request.cmd=='getPage'){
            console.log("getPage");
            //console.log(request.page);
            sendResponse({"arr":3});
            ext_page=3;
            //g_newsArr=request.arr;
        }
        if(request.cmd=='showPage'){
            console.log("showPage");
            sendResponse({"arr":ext_page});
        }
    //console.log("msg----------contentscript.js" + request.greeting);
    //getOrderInfo( sendResponse );
  });

 

参考文档   http://open.chrome.360.cn/extension_dev/cookies.html

实例  http://www.cnblogs.com/rwxwsblog/p/4490530.html

        http://www.cnblogs.com/champagne/p/4826611.html

 

 

 

 

© 著作权归作者所有

共有 人打赏支持
永不止步0929
粉丝 0
博文 29
码字总数 7592
作品 0
海淀
程序员
实用的Laravel Debug调试工具

转载请注明: 转载自Yuansir-web菜鸟 | LAMP学习笔记 本文链接地址: 实用的Laravel Debug调试工具 主要推荐laravel几个适合开发调试用的工具 1.Clockwork 首先Chrome 插件 Clockwork 安装 Co...

Yuansir
2015/01/19
0
2
Masonry:一款很好用的jquery网页瀑布流布局插件

类似的布局,似乎一夜之间出现在国内外大大小小的网站上,比如 Pinterest (貌似是最早使用这种布局的网站了),Mark之,蘑菇街,点点网,以及淘宝最新上线的“哇哦” 等等。通常,随着页面滚动...

mickelfeng
2013/05/28
0
0
chrome浏览器jsonView插件安装

chrome 应用商店打不开,想装插件愁死人了。 今天想到一个好方法,以 jsonView插件为例分享一下。 1、打开 https://github.com ; 2、搜索 jsonView 链接:https://github.com/search?utf8=...

hengbao5
08/03
0
0
开发google浏览器chrome的JS插件

这篇文章,实际上是回答我的上篇博文之《WEB攻击技巧之网页脚本攻击》所留下的问题,见网址:http://my.oschina.net/hetiangui/blog/135462 本篇博文测试网址,就是上篇博文中的网址: http...

BLUE-魏晓峰
2013/06/05
0
6
“插件(application/x-vlc-plugin)不受支持”NPAPI和PPAPI的问题

最近做一个前端的项目,项目需要引用VLC浏览器插件,javascript在IE、Firefox等浏览器上都没有问题,唯独在Chrome(谷歌)浏览器中插件不能被会支持。    不断更换Chrome版本后发现了问题。只...

yizhichao
07/25
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

windbg学习记录

我开始熟练使用windbg是从帮助手册开始的,也就是.hh命令。 就像学习windows开发从msdn开始一样,微软的产品虽然不开源,但是文档做的是相当的好。然而那些开源的东西呢?开源的竞争力其实就...

simpower
5分钟前
0
0
学习scala的网站汇总

https://www.codacy.com/blog/how-to-learn-scala/

Littlebox
7分钟前
0
0
配置本地的cloud9开发环境

前言 说到(前端)在线IDE开发环境,cloud9是不能绕过的,cloud9支持很多语言,默认支持的就有Node.js,Python,Ruby,PHP,Go,更逆天的是,他还支持数据库,包括MySQL,MongoDB,Redis,S...

Kefy
11分钟前
0
0
springcloud应用程序上下文层次结构

如果您从SpringApplication或SpringApplicationBuilder构建应用程序上下文,则将Bootstrap上下文添加为该上下文的父级。这是一个Spring的功能,即子上下文从其父进程继承属性源和配置文件,因...

itcloud
16分钟前
0
0
新程序员最爱的免费资源

简评:国外美女程序员推荐了她自己用过的一些免费资源,对新手比较友好的那种。 原作者 Ali Spittel,是个美女程序员,以下这些资源都是她自己试过的。以下「我」代表 Ali Spittel。 学 HTML...

极光推送
19分钟前
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部