本文主要内容 contextMenus的设置 打开权限 创建菜单 点击菜单 background script向content script发送消息 1. contextMenus的设置 1.1 打开权限 contextMenus同其它功能一样,都需要在permissions里指定开启,所以非常简单,在项目的manifest.json文件的permissions中加上contextMenus "permissions": [ "contextMenus" ] 这样就…
chrome中的本地存储其实也是用的HTML5中localStorage,唯一区别是chrome扩展有自己的localStorage,它属于这个扩展,而不属于一个域名.得用这一点可以很好的处理扩展自己的一些数据,而不受访问网站和域名的影响. localStorage基础 localStorage是HTML5特性,所以有些浏览器不一定支持,不过我们这里讲的是chrome扩展,所以完全不用担心这个问题.如果想在WEB页面上使用,那就要检查一下是不是支持它 可以这样的检测: if(window.loc…
一.本文主要涉及相关内容: chrome.proxy pacScript browser_action popup localStroage 二.预览 (代理运行截图,图中的代理服务器有防火墙,暂不对外) 如图所示,代理配置界面通过点击browser_action按钮打开,在popup页面内进行.可以设置服务器,也可以添加删除站点.好了,开始一些简单的说明工作 三.proxy 在chrome扩展中,要使用proxy同任何一种chrome对象一样,需要在json配置中允许chrome操作,在之前的…
chrome在一次更新之后,出于安全考虑,完全的禁止了content_script从https向http发起ajax请求,即使正常情况下也会在console里给出提示.这对于WEB来讲是好事,但对于扩展来讲就是坏事.平时可以很容易的请求数据,现在就没那么容易了.好在chrome还提供了background_script,利用content_script和background_script之前的通信来实现ajax的请求,就跳过了chrome的这一限制. content_script 从名字里就知道…
首先说明,chrome的扩展并不它的插件,网上很多说写插件,其实都是说的扩展.写扩展并不复杂,只要根据chrome提供的一系列的API进行就可以实现很多的功能.只是对API的学习是有代价的,加上国内访问chrome官网文档并不顺利.虽然360提供了一个翻译文档,而且有不少例子,但它的内容还是太少,有些问题它仍然没有涉及.所以,如果是做一个简单的应用没有什么问题,但实际的项目开发往往得不到有用的介绍和解释. 这个系列的文章将从解决一些实际的问题入手,涉及的内容大致有以下几个: 基础配置 conte…
1]前往这里下载你喜欢的语言的组策略模板 后缀为.adm (其他的文件自己看 https://docs.google.com/viewer?a=v&pid=sites&srcid=Y2hyb21pdW0ub3JnfGRldnxneDo0NDIwNzE0Njg2NzQzMmY5 这是官方的发布地址,以后更新应该也是在这里(在度娘盘传了份,这里荡不来的同学,可以用下面的 2] Win+R  gpedit.msc3]本地计算机策略 > 计算机配置 > 管理模板.4]右键管理模板,选择…
(!!!!以前的好用的, 现在不行了~) 做chrome扩展桌面通知, 可能不想让浏览器自动关闭某个重要的桌面通知.那就不要使用 chrome.notifications.create 可以用 Web Notifications用法: var notification = new Notification( "New Email Received", {icon: "mail.png", tag: {msg} }); notification.onshow = fu…
大家肯定有这样的经历,浏览网页的时候,左右两端广告,诸如“屠龙宝刀,点击就送”,以及最近火的不行的林子聪37传奇霸业什么“霸业面具,霸业吊坠”的魔性广告总是充斥我们的眼球. 当然有现成的扩展程序或者插件(两者概念稍有不同)可以清除页面广告,但是既然身为一名程序猿,尤其是FEDer,为什么不尝试一下自己写一个清除广告的扩展程序呢.其实,编写一个浏览器扩展程序十分简单,尤其是chrome扩展,可以完全使用前端技术(HTML/CSS/JS)完成一个自己编写的扩展程序.让我们一步一步,学习一下如何编写一…
大家肯定有这样的经历,浏览网页的时候,左右两端广告,诸如“屠龙宝刀,点击就送”,以及最近火的不行的林子聪37传奇霸业什么“霸业面具,霸业吊坠”的魔性广告总是充斥我们的眼球. 当然有现成的扩展程序或者插件(两者概念稍有不同)可以清除页面广告,但是既然身为一名程序猿,尤其是FEDer,为什么不尝试一下自己写一个清除广告的扩展程序呢.其实,编写一个浏览器扩展程序十分简单,尤其是chrome扩展,可以完全使用前端技术(HTML/CSS/JS)完成一个自己编写的扩展程序.让我们一步一步,学习一下如何编写一…
手把手教你开发chrome扩展一:开发Chrome Extenstion其实很简单   手把手教你开发chrome扩展一:开发Chrome Extenstion其实很简单 手把手教你开发Chrome扩展二:为html添加行为 手把手教你开发Chrome扩展三:关于本地存储数据 Chrome的更新速度可以说前无古人,现在我每天开机的第一件事就是打开Chrome检查是不是有了新版本.界面清爽.操作人性化.网络备份资料和快速的启动速度令我爱不释手,还有它拥有众多的扩展程序,相对于firefox的插件来…
chrome拓展开发实战:页面脚本的拦截注入 时间 2015-07-24 11:15:00  博客园精华区 原文  http://www.cnblogs.com/horve/p/4672890.html 主题 Chrome 原文请访问个人博客: chrome拓展开发实战:页面脚本的拦截注入 目前公司产品的无线站点已经实现了业务平台组件化,所有业务组件的转场都是通过路由来完成,而各个模块是通过 requirejs 进行统一管理,在灰度测试时会通过grunt进行打包操作,虽然工程化的开发流程已经大大…
目录: 0.Chrome扩展开发(Gmail附件管理助手)系列之〇——概述 1.Chrome扩展开发之一——Chrome扩展的文件结构 2.Chrome扩展开发之二——Chrome扩展中脚本的运行机制和通信方式 3.Chrome扩展开发之三——Chrome扩展中的数据本地存储和下载 4.Chrome扩展开发之四——核心功能的实现思路 5.Chrome扩展开发之五——采用指数退避算法实现ajax请求的重发,全部完成时触发回调函数 如果你对GmailAssist感兴趣,可以在chrome商店中搜索“…
chrome在一次更新之后,出于安全考虑,完全的禁止了content_script从https向http发起ajax请求,即使正常情况下也会在console里给出提示.这对于WEB来讲是好事,但对于扩展来讲就是坏事.平时可以很容易的请求数据,现在就没那么容易了.好在chrome还提供了background_script,利用content_script和background_script之前的通信来实现ajax的请求,就跳过了chrome的这一限制. content_script 从名字里就知道…
起 最近利用闲暇时间在进行一款 chrome 扩展 V2EX-HELPER 的开发(如果巧遇 V 友欢迎试用),今天把它彻底改成了用 webpack 打包依赖的模式,不由得感概 webpack 的强大,记录一二. 古 之前的项目开发是非常传统的 chrome 扩展开发方式,代码可以猛戳 这里.截止目前,该扩展主要由三部分组成,background-scripts,content-scripts 以及 option 页面.一开始做这个扩展的时候,只是为了实现一个功能,所以就一个 backgroun…
chrome是一个不错的浏览器,web开发者工作中一般都会使用chrome做为默认浏览器,它有很多扩展,给浏览器补充了各种功能,增强了用户体验.chrome具体能干什么?怎么做出来的呢? chrome扩展是什么? 本质上是HTML+CSS+JavaScript组成的页面,所有文件打包成crx文件,安装到chrome,就可以使用 chrome扩展能干什么? chrome扩展可以操作浏览器的书签.cookie.历史记录.右键菜单.tab选项卡.浏览器窗口,甚至可以读取系统信息包括CPU.内存等,扩展…
关于 chrome 扩展的文章,很久之前也写过一篇.清除页面广告?身为前端,自己做一款简易的chrome扩展吧. 本篇文章重在分享一些制作扩展的过程中比较重要的知识及难点. 什么是 chrome 扩展程序 扩展程序是一些能够修改或增强 Chrome 浏览器功能的小程序.对于前端工程师而言,其最大的便利就是我们可以应用我们熟悉的 HTML.CSS . Javascript 等技术来制作扩展程序. 如下图所示,这些图标就是各种开发者提供的 chrome 扩展程序: 区分扩展与插件 很多人会误称扩展程…
关于 chrome 扩展的文章,很久之前也写过一篇.清除页面广告?身为前端,自己做一款简易的chrome扩展吧. 本篇文章重在分享一些制作扩展的过程中比较重要的知识及难点. 什么是 chrome 扩展程序 扩展程序是一些能够修改或增强 Chrome 浏览器功能的小程序.对于前端工程师而言,其最大的便利就是我们可以应用我们熟悉的 HTML.CSS . Javascript 等技术来制作扩展程序. 如下图所示,这些图标就是各种开发者提供的 chrome 扩展程序: 区分扩展与插件 很多人会误称扩展程…
转载:http://www.cnblogs.com/walkingp/archive/2011/04/04/2003875.html 手把手教你开发chrome扩展一:开发Chrome Extenstion其实很简单   手把手教你开发chrome扩展一:开发Chrome Extenstion其实很简单 手把手教你开发Chrome扩展二:为html添加行为 手把手教你开发Chrome扩展三:关于本地存储数据 Chrome的更新速度可以说前无古人,现在我每天开机的第一件事就是打开Chrome检查是…
    1.初始化文件 Chrome 官方扩展教程地址 新建一个文件夹 zhi-follow 下图中 1 部分为 默认的图标3种尺寸 会显示在 Chrome 中   2. 定义按钮样式   页面上会有两个展示按钮,方便随时控制收听的进度   .follow_them_box{ position: fixed; right: 200px; top: 200px; background-color: #fff; width: 80px; height: 30px; line-height: 30px…
整理 Kindle 标注.书签和笔记从未如此简单! Kindle 标注管理应用 Kindle Mate 只支持 Windows,不支持 Mac.标注只是解析我的剪贴文本文件,配合 FileReader API,写个 Chrome 扩展解析文本文件就好了. Chrome 下载地址 Github 地址 初始化项目 安装 React 脚手架 create-react-app npm i -g create-react-app 初始化项目 create-react-app my-clippings --…
1.写在前面 首先感谢小茗同学的文章-[干货]Chrome插件(扩展)开发全攻略, 基于这篇入门教程和demo,我才能写出这款 基于chrome扩展的自动答题器. git地址: https://gitee.com/cifang/lighthouse_answering_machine.git 2.开发背景 去年12月,某省委组织部举办了一系列学习竞赛活动,第一期时,参加人数寥寥,在第二期时,便通过党组织渠道要求所有党员保质保量的参加. 该活动每期10天,每天有一次答题机会,每一期通过分享可获得额…
前言 作为一个前端开发, 在调试生产环境的代码时,是否苦于生产环境代码被压缩,没有sourcemap? 有没有想过将生产环境的js直接重定向为本地开发环境的js? 玩微前端时,有没有想过用本地的子应用js去替换线上的子应用js? 或者有没有想过修改别人网站的文件,直接完成某些非常规操作? 最近因为项目开发中有这么一个小需要,我写了个chrome扩展插件解决这个问题,当然Edge浏览器也能用. 这个扩展插件安装后,可以直接将一个js重定向为另一个js. 先给上这个扩展插件的仓库地址:Demo 周六…
原文转载自「刘悦的技术博客」https://v3u.cn/a_id_120 就在不久之前,我们目前这个毕业班的班长那日同学和我说,他正在公司开发Chrome扩展,看起来很高大上的技术,实际开发却非常简单,这引起了我非常浓厚的兴趣,正所谓技不压身,检验自身技术的手段之一就是拥抱新事物,这一次我们尝试在半小时内开发一款Chrome扩展,因为之前我们做了一个微信小程序的在线面试题题库的项目,所以正好利用这个题库将面试题平移到Chrome扩展上面. Chrome插件其实和一个普通web应用一样都是由ht…
Chrome的扩展程序很多,也很容易入门,可以来简单实现一下 看看,慢慢就能实现出一个扩展程序来 每个扩展程序应用一般会包含: 一个manifest清单文件 html文件 js文件 其他文件等 可以看到,其实结构如同一般的页面,有共通之处. 一.了解Chrome扩展程序 Chrome扩展程序商店地址为:https://chrome.google.com/webstore/category/extensions?hl=zh-CN 访问Chrome浏览器中已安装的扩展:chrome://extens…
目录: 0.Chrome扩展开发(Gmail附件管理助手)系列之〇——概述 1.Chrome扩展开发之一——Chrome扩展的文件结构 2.Chrome扩展开发之二——Chrome扩展中脚本的运行机制和通信方式 3.Chrome扩展开发之三——Chrome扩展中的数据本地存储和下载 4.Chrome扩展开发之四——核心功能的实现思路 5.Chrome扩展开发之五——采用指数退避算法实现ajax请求的重发,全部完成时触发回调函数 如果你对GmailAssist感兴趣,可以在chrome商店中搜索“…
chrome浏览器自从去年以来逐步去掉了对浏览器插件的支持,npapi的方案马上不可用. 当务之急要选择一个替代方案,最常用的就是扩展了.扩展程序提供了一套和本地程序交互的方案——“原生消息通信” 写本地应用的工具和语言很多,比如:C#,C++,phyon 都可以,本人对delphi熟悉一点,就说说delphi怎么接收和发送消息的吧. Chrome扩展对原生消息通信有非常明确的说明 Chrome 浏览器在单独的进程中启动每一个原生消息通信宿主,并使用标准输入(stdin)与标准输出(stdout…
目录: 0.Chrome扩展开发(Gmail附件管理助手)系列之〇——概述 1.Chrome扩展开发之一——Chrome扩展的文件结构 2.Chrome扩展开发之二——Chrome扩展中脚本的运行机制和通信方式 3.Chrome扩展开发之三——Chrome扩展中的数据本地存储和下载 4.Chrome扩展开发之四——核心功能的实现思路 5.Chrome扩展开发之五——采用指数退避算法实现ajax请求的重发,全部完成时触发回调函数 如果你对GmailAssist感兴趣,可以在chrome商店中搜索“…
大家都知道JS是运行在客户端的,所以,如果我们自己写一个浏览器的话,是一定可以往下载下来的网页源代码中加入js的.可惜我们没有这个能力.不过幸运的是,chrome的扩展程序可以帮我们做到这件事. 本文会做一个chrome插件开发的入门介绍,实现利用chrome扩展实现在目标网页运行我们的js的功能.关于chrome扩展的详细内容,可以通过官网了解. 开发工具很简单,记事本就OK了,当然还要有一个chrome浏览器. 新建一个文件夹,比如,HelloWorld 然后创建一个文本文件,作为这个扩展程…
转载自https://www.imququ.com/post/chrome-extensions-and-user-privacy.html   Google Chrome浏览器应该早就是大家的默认了,就连我这个Firefox的忠实用户(至少7年),前不久也换到Chrome了.Chrome本身非常安全,但是很早就有网站报道Chrome扩展很容易在用户浏览的任意网站注入js,收集用户行为:替换链接进行盈利:甚至盗取用户账户信息. 今天从Chrome Web Store官方下载安装了几个扩展后,亲身…
Chrome的扩展程序很多,也很容易入门,可以来简单实现一下 看看,慢慢就能实现出一个扩展程序来 每个扩展程序应用一般会包含: 一个manifest清单文件 html文件 js文件 其他文件等 可以看到,其实结构如同一般的页面,有共通之处. 一.了解Chrome扩展程序 Chrome扩展程序商店地址为:https://chrome.google.com/webstore/category/extensions?hl=zh-CN 访问Chrome浏览器中已安装的扩展:chrome://extens…