Chrome浏览器扩展开发系列之一:初识Google Chrome扩展
1. Google Chrome扩展简介
Google Chrome扩展是一种软件,以增强Chrome浏览器的功能。
Google Chrome扩展使用HTML、JavaScript、CSS和图片等Web技术开发。
Google Chrome扩展与Google Chrome插件不同。Google Chrome扩展无需了解浏览器的源代码,而Google Chrome插件是更底层的浏览器功能扩展,需要深入掌握浏览器的源代码。
2. Google Chrome扩展的基本组成
Google Chrome扩展,至少包括一个manifest.json和一个js文件
- manifest.json是扩展的调度中心,用于声明各种资源。该文件采用JSON格式定义
- js文件中定义要执行的操作
Google Chrome扩展,通常还可以包括图标、页面和CSS等资源
- 图标通常是19px*19px的PNG文件
- 页面通常是HTML文件,用于定义显示给用户的窗口,如popup页面或options页面等
注意:控制popup窗口或options窗口的分别是popup.js和options.js文件
- CSS是常见的定义页面样式的文件
作为一个Google Chrome扩展,上述所有文件应该都位于一个根目录之下,各个不同类型的文件可以位于不同的子目录下。
3. Google Chrome扩展的部署运行
Google Chrome扩展的运行无需依赖任何Web服务器。Chrome 浏览器可以方便地进行部署、测试和运行。通过Chrome 浏览器打开chrome://extensions页面可以查看当前Chrome 浏览器部署的全部扩展,该页面也可以通过Chrome 浏览器的“ ->更多工具->扩展程序”打开。chrome://extensions页面如下:

在chrome://extensions页面中,选中右上角的“开发者模式”,出现开发辅助按钮如下:

在开发者模式中,开发人员可以通过“加载已解压缩的扩展程序…”按钮,直接加载并调试Google Chrome扩展。当然,也可以直接将扩展程序所在的目录拖放到chrome://extensions页面中,实现对扩展程序的加载。Chrome 浏览器会对加载的扩展程序的manifest.json文件进行语法有效性验证,通过验证的扩展程序将会立刻在Chrome 浏览器中生效。
注意:manifest.json文件仅在加载过程中被读取一次。对manifest.json文件的修改必须通过重新加载才能够生效。
在开发过程中,开发人员可以通过“立即更新扩展程序”按钮,查看Google Chrome扩展的最新变化。
Google Chrome扩展开发完毕,开发人员可以通过“打包扩展程序…”将程序打包为一个.crx文件,以便于发布。
通过Chorme Developer Dashboard (注册需要$5),可以将Google Chrome扩展发布到Chrome Web Store。
Chrome浏览器扩展开发系列之一:初识Google Chrome扩展的更多相关文章
- Chrome浏览器扩展开发系列之三:Google Chrome浏览器扩展的架构
1) 不可视的background页面 Google Chrome扩展往往包含一个不可见的background页面,Google Chrome扩展的主要业务逻辑都位于此.有两种类型的backgroun ...
- Chrome浏览器扩展开发系列之十九:扩展开发示例
翻译总结了这么多的官网内容,下面以一款博主开发的“沪深股票价格变化实时追踪提醒”软件为例,介绍Chrome浏览器扩展程序的开发,开发环境为Eclipse IDE+Chrome Browser. “沪深 ...
- Chrome浏览器扩展开发系列之十六:扩展中可用的Chrome浏览器API
除了Chrome浏览器支持的chrome.* API之外,Chrome浏览器扩展还可以使用Chrome浏览器为Web页面或Chrome app提供的APIs.对于Chrome浏览器2支持的API,还可 ...
- Chrome浏览器扩展开发系列之十八:扩展的软件国际化chrome.i18n API
i18n是internationalization 的简写,这里将讨论软件国际化的问题.熟悉软件国际化的朋友应该知道,软件国际化要求,页面中所有用户可见的字符串都必须置于资源属性文件中.资源属性文件中 ...
- Chrome浏览器扩展开发系列之九:Chrome浏览器的chrome.alarms.* API
Chrome浏览器扩展程序通过chrome.alarms.* API,可以制定计划周期性地执行代码,或在指定时间执行代码. 要使用chrome.alarms.* API,首先需要在manifest.j ...
- Chrome浏览器扩展开发系列之十四
Chrome浏览器扩展开发系列之十四:本地消息机制Native messaging 时间:2015-10-08 16:17:59 阅读:1361 评论:0 收藏:0 ...
- Chrome浏览器扩展开发系列之十四:本地消息机制Native messagin
Chrome浏览器扩展开发系列之十四:本地消息机制Native messaging 2016-11-24 09:36 114人阅读 评论(0) 收藏 举报 分类: PPAPI(27) 通过将浏览器 ...
- Chrome浏览器扩展开发系列之六:options 页面
options 页面用以定制Chrome浏览器扩展程序的运行参数. 通过Chrome 浏览器的“工具 ->更多工具->扩展程序”,打开chrome://extensions页面,可以看到有 ...
- Chrome浏览器扩展开发系列之十三:消息传递Message
由于content scripts运行在Web页面的上下文中,属于Web页面的组成部分,而不是Google Chrome扩展程序.但是content scripts又往往需要与Google Chrom ...
随机推荐
- Java类加载器详解
title: Java类加载器详解date: 2015-10-20 18:16:52tags: JVM--- ## JVM三种类型的类加载器- 我们首先看一下JVM预定义的三种类型类加载器,当一个 J ...
- angularjs里重要的route
写一段代码来解释吧! <!DOCTYPE html><html ng-app="mainApp"><head lang="en"& ...
- 2017CUIT校赛-线上赛
2017Pwnhub杯-CUIT校赛 这是CUIT第十三届校赛啦,也是我参加的第一次校赛. 在被虐到崩溃的过程中也学到了一些东西. 这次比赛是从5.27早上十点打到5.28晚上十点,共36小时,中间睡 ...
- day5_ 导入模块和包
######################模块导入模块做的事1.产生新的名称空间2.以新建的名称空间为全局名称空间,执行文件的代码3.拿到一个模块名spam,指向spam.py产生的名称空间 imp ...
- 发布高性能迷你React框架anu
anu, 读作[安努],原意为苏美尔的主神. anu是我继avalon之后又一个新框架(github仓库为https://github.com/RubyLouvre/anu, 欢迎加星与试用) 此框架 ...
- Java 9 揭秘(3. 创建你的第一个模块)
文 by / 林本托 Tips 做一个终身学习的人. 在这个章节中,主要介绍以下内容: 如何编写模块化的Java程序 如何编译模块化程序 如何将模块的项目打包成模块化的JAR文件 如何运行模块化程序 ...
- Mybatis中如何查询时间段内的数据
最后一个是正确的,前边的三个是可能遇到的坑,给大家展示一下,如果不需要的,可以直接跳到最后看: 有时候我们需要查询一张表内一段时间内操作的数据,大家很容易就想到了 between ? and ? 这个 ...
- mysql之 mysql 5.6不停机主主搭建(活跃双主基于日志点复制)
环境说明:版本 version 5.6.25-log 主库ip: 10.219.24.25从库ip:10.219.24.22os 版本: centos 6.7已安装热备软件:xtrabackup 防火 ...
- Day1 - Python基础1 Python介绍、基本语法、流程控制习题集
1.打印Hello World! print("Hello World!") 或 name="你好,世界!" print(name) 2.声明变量:打印name ...
- 渗透测试工具Nmap从初级到高级
Nmap是一款网络扫描和主机检测的非常有用的工具. Nmap是不局限于仅仅收集信息和枚举,同时可以用来作为一个漏洞探测器或安全扫描器.它可以适用于winodws,linux,mac等操作系统.Nmap ...