reizhi也是chrome的爱好者之一,从最原始的IE,到假死王maxthon,再到轻快的opera,最后让我留恋chrome的理由还是强大的可扩展性。...Tampermonkey下载安装地址 https://chrome.google.com/we……kfjojejmpbldmpobfkfo 在chrome上安装好Tampermonkey扩展后...,便可添加JS脚本开始工作了。...除了从各大论坛下载JS脚本之外,userscripts也是非常棒的一个脚本扩展集合网站。 ...Crack Url Wait Code Login For Chrome是我所向大家推荐的必备JS脚本之一。常逛论坛的你一定见过各种各样的网盘,飞速,城通,千军万马等。
学习Chrome扩展插件势在必行♂️ Chrome extensions 文档 插件的架构可以参考这里 Chrome扩展程序应用商店入口 管理使用chrome扩展。...3、扩展如何工作 扩展是基于 HTML、JavaScript 和 CSS 等 Web 技术构建的。它们在单独的沙盒执行环境中运行,并与 Chrome 浏览器交互。...、background.js、content_script.js 下图展示他们之间的关系,以及如何通信 (图片来源网络,侵删) 运行时的三个进程: 扩展进程(Extension Process)...和popup.html, backgrount.html中没有任何内容,是通过background.js创建生成,当浏览器打开时,会自动加载插件的background.js文件,它独立于网页并且一直运行在后台...最后 本文介绍的是 chrome 扩展基础知识,相信看完以上之后,你会对 Chrome 扩展插件有了一个比较清晰的认识。
扩展demo", // 图标,一般偷懒全部用一个尺寸的也没问题 "icons": { "16": "img/icon.png", "48": "img/icon.png", "128"...按顺序注入 "js": ["js/jquery-1.8.3.js", "js/content-script.js"], // JS的注入可以随便一点,但是CSS的注意就要千万小心了,因为一不小心就可能影响全局样式.../inject.js"], // 插件主页,这个很重要,不要浪费了这个免费广告位 "homepage_url": "https://www.baidu.com", // 覆盖浏览器默认页面 "chrome_url_overrides...", // Chrome40以后的插件配置页写法,如果2个都写,新版Chrome只认后面这一个 "options_ui": { "page": "options.html", // 添加一些默认的样式...'); temp.src = chrome.extension.getURL('js/inject.js'); document.documentElement.appendChild(temp);
Chrome的扩展程序很多,也很容易入门,可以来简单实现一下 看看 官方文档 或者翻译的文档:百度、360,慢慢就能实现出一个扩展程序来 每个扩展程序应用一般会包含: 一个manifest清单文件 html...一、了解Chrome扩展程序 Chrome扩展程序商店地址为:https://chrome.google.com/webstore/category/extensions?...hl=zh-CN 访问Chrome浏览器中已安装的扩展:chrome://extensions/ ?...": ["js/jquery.js", "js/content.js"] }] } 这就是需要的清单文件了,定义了程序的基本信息,这些字段的作用就自行去 文档 查看吧 文件目录结构为: ?...可以看到计算器已经在扩展程序之中 再看看博客文章下的广告,已经被清除了 ? ? 三、发布Chrome扩展程序 自己的Chrome扩展程序写好之后,可以发布到商城之中 这篇文章 讲得挺好,就不多说了
而提到 Chrome 就绕不开它的扩展,或者叫插件(Chrome Extension)。 可以从 应用商店下载安装。应用商店除了有 Chrome 扩展程序,也有丰富的 Chrome主题背景。...一、Chrome 扩展应用程序构成(manifest v3版本) Chrome 扩展开发所用到的技术栈就是html/js/css。可以说就是纯“前端开发”,其界面是用 html+css 画的。...": "background.js" }, "options_page": "options.html" } 1)扩展图标 扩展图标即扩展在浏览器扩展区域显示的 logo,可以自定义,也可以缺省...注入的 js 代码能够操作页面 DOM,可以调用浏览器原生API,可以发起页面请求,但是它具有独立的执行空间,也就是说注入的 js 和页面本身的js脚本不能够直接互相调用。...绝大多数 chrome.* api 都是异步的,如果需要拿到异步执行的结果,需要传入 `callback` 方法。 下面象征性的举个例子,来描述一下一个插件的执行和交互。
Chrome 扩展的安全性设计确实不允许在 HTML 页面中直接使用 JavaScript 代码来加载或执行扩展的功能。Chrome 扩展通过内容安全性策略来限制可以在页面上执行的脚本。...这意味着扩展不能简单地通过内联 标签或通过 document.write() 插入的脚本来执行。这是为了防止恶意代码的执行和保护用户的安全。所以都是写在另外的 js 文件当中。...; }); }); background background.js 文件是 Chrome 扩展的后台脚本,用于处理长期运行的任务、事件和状态管理。它在浏览器的后台运行,并且在浏览器启动时加载。...处理安装事件 在扩展安装或更新时执行一些初始化操作: chrome.runtime.onInstalled.addListener((details) => { if (details.reason...扩展中,content.js 是内容脚本,用于在匹配的网页上执行 JavaScript 代码。
使用typescript开发chrome扩展 记录一下使用typescript开发chrome扩展的相关配置。 1....安装依赖 必定需要用到的开发依赖项: chrome-types copy-webpack-plugin ts-loader typescript webpack-cli npm install chrome-types.../src/index.ts', filename: 'index.js' }, background: { import: '..../src/background.ts', filename: 'background.js' } }, plugins: [ new CopyPlugin({...作为小程序后端——小程序请求前置检查 Windows rclone挂载sftp 迁移——从Electron迁移到Eclipse Theia 使用typescript开发chrome扩展 use multiple
扩展 定义对象 var zj = zj || {}; 字符串转json对象 /** * 字符串转json对象 */ zj.toJson = function(result) { if (typeof...document.body.appendChild(iframe); console.info(nowDate); window.open(url, nowDate); console.info(nowDate); } js...进行post同步提交 /** * js进行post同步提交 */ zj.post = function(URL, PARAMS) { var temp = document.createElement...Sys.chrome = s[1] : (s = ua .match(/opera.([\d.]+)/)) ?...) { scan = { "bowser" : "chrome", "version" : zj.getLeftStr(Sys.chrome
作者:苏生不惑 来源:苏生不惑 之前已经写过不少Chrome扩展那些我常用的 Chrome 扩展,这里继续推荐那些实用Chrome扩展 ,所谓实用就是能解决实际问题。...下载Chrome扩展需要先上谷歌,公众号回复 谷歌 获取使用方法,当然你也可以使用 https://chrome-extension-downloader.com/ 这个网站来下载crx文件,然后手动安装...手动安装扩展 关于手动安装Chrome扩展还有小伙伴不大会用 ?...简单来说就是打开谷歌的扩展管理页面 chrome://extensions/ ,然后将下载crx文件拖进去,如果提示该扩展程序未列在 Chrome 网上应用店中,并可能是在您不知情的情况下添加的或者程序包无效...自己摸索几下就会了,上谷歌后安装扩展就不用这么折腾了。 ? 下面是推荐的5个Chrome扩展。
,就是扩展的图标~~~ popup.html 点击扩展图标,弹出的面板页面(如果在manifest.json中配置了default_popup为该文件的话) popup.js popup.../public/js/background.js"] } } chrome_url_overrides chrome_url_overrides 属性可以自定义的页面替换 Chrome 相应默认的页面...ALic_Chrome ? Alic_Chrome 简单的扩展插件就完成了 ~~~ ---- ****background交互**** 简单来说呢,上面完成的其实就是一个扩展程序的微框架。...{}); 开发一个简单Chrome扩展程序基本是没有什么大问题的!...我的体会呢,要是主要用于离线的呢,还是开发应用好点,扩展程序也不是不可以,否则数据存储方面就使用js处理即可! ----
从零实现的Chrome扩展 Chrome扩展是一种可以在Chrome浏览器中添加新功能和修改浏览器行为的软件程序,例如我们常用的TamperMonkey、Proxy SwitchyOmega、AdGuard...Manifest 我们可以先来想一下浏览器拓展到底是什么,浏览器本身是支持了非常完备的Web能力的,也就是同时拥有渲染引擎和Js解析引擎,那么浏览器拓展本身就不需要再去实现一套新的可执行能力了,完全复用...直接通过类似于Js Bridge的方式暴露出一些接口就可以了,这样还可以更方便地做到权限控制,一定程度避免浏览器扩展执行一些恶意的行为导致用户受损。...,最后将Js注入到HTML当中就可以了,在这里我们直接配置一个多入口的输出能力,通常一个扩展插件不会是只有一个Js和HTML文件的,所以我们需要配置一个多入口的能力。...服务器,可以通过new WebSocket来链接并且在监听消息,当收到来自服务端的reload消息之后,我们就可以执行chrome.runtime.reload()来实现插件的重新加载了,那么在开启的WebSocket
喜欢chrome浏览器又经常使用迅雷下载东西的朋友注意了,chrome迅雷下载扩展已经发布了。再也不用复制到IE打开或者使用IE tab了。...目前只支持chrome浏览器内左键点击下载,支持以下文件类型的绝对路径下载地址:“rar、zip、tar、iso、exe、dll、rmvb、rm、avi、mp3、wma、wmv、wmp、mpg、mpeg...太平洋下载、霏凡软件站、中关村在线、天空软件站”(华军的下载页提供的是绝对地址,不需要专门支持) 支持绝对路径的BT种子下载 支持ed2k链接的点击下载,但不支持VeryCD下载页中的“下载选中的文件” 扩展下载
本文的目标群体:已经了解或使用过chrome扩展应用,但是自己不知道如何开发一个chrome扩展应用的工程师。如果有具体的chrome扩展应用开发经验的同学,本篇文章可能太过简单,并不适合你。...本文的主要内容如下: chrome扩展应用模块功能介绍 chrome扩展应用模块开发介绍 本文的内容不包括chrome扩展应用开发时提供的各个API功能详解,有需求的同学可以自行查看官方API文档。...从官方的介绍我们可以知道,Background Pages的作用就是在浏览器运行时,会长时间执行的脚本。只要浏览器处于打开状态,在Background Pages中的脚本就会在后台执行。...从上面官方的介绍我们可以知道,Content Script其实就是我们需要写的将会在我们希望的目标页面中执行的脚本文件。每次目标页面刷新时,这部分脚本也会重新加载执行。...如果大家想对chrome扩展应用有一个更加深入的了解,那么建议自己动手开发相关的功能。这样才能够对chrome扩展应用的相关逻辑有一个更加清楚的认识。
之前已经写过不少Chrome扩展那些我常用的 Chrome 扩展,这里继续推荐那些实用Chrome扩展 ,所谓实用就是能解决实际问题。...下载Chrome扩展需要先上谷歌,公众号回复 谷歌 获取使用方法,当然你也可以使用 https://chrome-extension-downloader.com/ 这个网站来下载crx文件,然后手动安装...手动安装扩展 关于手动安装Chrome扩展还有小伙伴不大会用 ?...简单来说就是打开谷歌的扩展管理页面 chrome://extensions/ ,然后将下载crx文件拖进去,如果提示该扩展程序未列在 Chrome 网上应用店中,并可能是在您不知情的情况下添加的或者程序包无效...自己摸索几下就会了,上谷歌后安装扩展就不用这么折腾了。 ? 下面是推荐的5个Chrome扩展。
1.下载扩展包,并将.crx后缀修改为.rar。 2.将上面的.rar文件解压 3.在扩展程序页面选择Load unpacked选项,然后选中刚才解压的文件夹,确定。插件安装成功。
忙活了有一段时间,零零散散的写了一个Chrome扩展。这里发发一篇文章安利一下。 怎样的一个扩展呢 它是一个Gmail 过滤器辅助工具,使用这个扩展可以轻松的创建邮件过滤器。 有图有真相 ?...如何下载 Chrome Store 大中华局域网用户下载地址 为什么写这个扩展 还是那个原因,自己遇到了不爽与痛点。 我是一个重度的Gmail用户,工作的邮箱使用Gmail托管。...开源么 当然开源,原因如下 个人能力和精力毕竟有限 希望通过社区的力量推动这个扩展持续发展 所以,如果你有想法的话,可以访问这个Github地址 https://github.com/androidyue.../Gmail-Helper-Filter 贡献力量 除了开源贡献代码外,如果你有想法,也可以共享力量,比如 提需求 提bug 分享本文或扩展 捐赠(下面那个红色按钮) 感谢 再次感谢我的御用设计师 大麦
扩展对应的crx文件,比如输入https://chrome.google.com/webstore/detail/evernote-web-clipper/pioclpoplcdbaefihamjohnefbikjilc...手动安装扩展 打开Chrome扩展程序 chrome://extensions/ ? 开启开发者模式 ?...谷歌商店安装 在国内谷歌商店默认是打不开的,所以这里分享一个谷歌访问助手(公众号内回复 谷歌 获取),安装这个扩展后就能上谷歌商店直接安装Chrome扩展了。...分享的谷歌助手扩展同样使用上面的方法来安装,如果提示该扩展程序未列在 Chrome 网上应用店中,并可能是在您不知情的情况下添加的或者程序包无效。...先把文件后缀名.crx 改成 .rar或者.zip,然后解压到一个文件夹,再打开扩展程序chrome://extensions/ ,点击加载已解压的扩展程序。 ?
之前写过 那些实用的 Chrome 扩展神器 那些实用的 Chrome 扩展神器(二),这里继续分享实用的 Chrome 扩展。 本来安装Chrome扩展很简单。 ?...但由于国内没法上谷歌,淘宝就有了对应的下载Chrome扩展服务,帮忙下载个插件收费20,第一次看到的时候我是震惊的。 ?...Chrome扩展地址 https://chrome.google.com/webstore/detail/distill-web-monitor/inlikjemeeknofckkjolnjbpehgadgge...Chrome扩展地址 https://chrome.google.com/webstore/detail/evernote-web-clipper/pioclpoplcdbaefihamjohnefbikjilc...Chrome扩展地址:https://chrome.google.com/webstore/detail/fcofohckagnahikfankmacbepefilmof
之前已经写过 那些实用的 Chrome 扩展神器 ,如果你不能上谷歌没法直接安装Chrome扩展,可以使用https://crxdl.com/ 这个网站下载crx文件,然后手动安装。 ?...Chrome扩展地址 https://chrome.google.com/webstore/detail/new-tong-wen-tang/ldmgbgaoglmaiblpnphffibpbfchjaeg...Chrome扩展地址 https://chrome.google.com/webstore/detail/rooster-for-chrome/pimolnhbniceppehbgmibnbgcnhpkhfh...OBS这类直播软件,就可以把浏览器任何页面直播到B站、斗鱼或者虎牙的直播间里去,假如你有自己的直播间并且也安装了Node.js的话,那么可以安装这个Chrome扩展玩下,适合做无人值守音乐轮播或者电影轮播什么的...Chrome扩展地址 https://chrome.google.com/webstore/detail/jfgjlmafdjaofbkjpaoojooghnocjcag
Chrome 浏览器扩展神器油猴 请停用以开发者模式运行的扩展程序?搞定谷歌浏览器插件弹窗 上不了谷歌如何安装 Chrome 扩展?...这里再推荐几个有趣/实用的 Chrome 扩展神器,都是我经常使用的。...二管家 这是一个管理扩展的扩展 ,可以获取扩展更新通知并记录拓展历史,自动开启/关闭拓展,根据当前网站获取二管家社区推荐,Chrome 扩展地址 https://chrome.google.com/webstore.../detail/nooboss/aajodjghehmlpahhboidcpfjcncmcklf ,安装Chrome扩展方法见之前文章 上不了谷歌如何安装 Chrome 扩展?...豆瓣账号备份 这个扩展用于备份豆瓣的用户数据及图片,并支持将备份数据导出到 Excel ,扩展地址https://chrome.google.com/webstore/detail/%E8%B1%86%
领取专属 10元无门槛券
手把手带您无忧上云