首页
学习
活动
专区
圈层
工具
发布

解密 JS 参数:逆向工程的实用技巧

,在它的回调函数中再添加一个对 Cookie 的监听事件 当监听到的 Cookie 满足条件时,发送消息给 Content Script 去执行具体的动作 需要指出的是,changeInfo.cause...(sender.tab.id, { action: "debugger" }); } }); } }); 1-3 触发调试 在 Content Script 中,主动触发一次发起调试的消息给...debugger; } }); 将编写好的 Chrome 插件安装到浏览器上,打开目标网站及浏览器开发者工具 只要指定的 Cookie 变动,就会自动触发调试操作 Cookie Hook 通过上面的方式仅仅只能发现...cookie_name"; //Hook Cookie Set //注意:这种方法可能与某些网站的JavaScript代码不兼容,因为它依赖于废弃的__defineSetter__方法 function...浏览器中安装扩展后,打开浏览器开发者工具和目前网站,一旦目标 Cookie 被设定一个值后,会自动进入断点模式 在调试模式下,我们就可以在 Source 面板利用 Call Stack 调用栈一步步查询到加密参数生成的具体逻辑

92230

浏览器插件开发-manifest文件解读「建议收藏」

插件之间的通信 消息传递 manifest.json 配置说明 manifest.json 用于描述 Chrome 插件的源数据,配置信息等,基本内容如下 { "name": "...扩展在他们的后台脚本中监视这些事件,然后用指定的指令进行响应 关于后台脚本的状态 首次下载后或者更新后被加载 后台脚本下载后会处于休眠状态,直到它侦听的某个事件被触发, 侦听到事件后,会使用指定的指令响应...(怎么相应自定义) 以下情况会需要调用到后台脚本 扩展首次下载或者版本更新 后台脚本中正在监听事件,并且这事件被触发了 content_script 或者其他扩展中调用了 sendMessage...新 tab 都可替换 10. commands 可以通过 commands 选项定义触发扩展事件的快捷键 { ..., commands: { "xxx": {...\ _execute_page_action 这两个命令不会被监听,他们是触发 popup 弹出的,要监听 窗口弹出事件可以使用 popup_page 的onDomReady 11. content_scripts

3.4K20
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    Chrome扩展程开发初探

    内容脚本: content_scripts:定义内容脚本,这些脚本将注入到匹配的网页中运行。内容脚本可以修改网页内容或监听网页事件。...Chrome 扩展的安全性设计确实不允许在 HTML 页面中直接使用 JavaScript 代码来加载或执行扩展的功能。Chrome 扩展通过内容安全性策略来限制可以在页面上执行的脚本。...、消息传递、浏览器事件监听、持久存储、定时任务和网络请求。...在 Chrome 扩展中,content.js 是内容脚本,用于在匹配的网页上执行 JavaScript 代码。...消息传递:与扩展的其他部分(如后台脚本 background.js、弹出页面 popup.js)进行消息传递和通信。 数据采集和分析:收集页面上的数据,进行分析或发送到后台进行处理。

    1K10

    盘点原生JavaScript中直接触发事件的方式

    JavaScript提供了多种方式来直接触发事件,无论是在用户交互、程序逻辑处理或是数据更新时。...本文将全面探讨原生JavaScript中各种事件触发方式,并通过深入的技术案例分析,帮助开发者掌握这些方法在实际开发中的应用。...使用dispatchEvent原生JavaScript中触发事件的核心方法是dispatchEvent。这个方法允许开发者为任何DOM元素触发几乎任何类型的事件,包括但不限于点击、改变、输入等。...;直接模拟事件处理器在较旧的JavaScript代码中,特别是在dispatchEvent方法出现之前,开发者通常会直接调用DOM元素上的事件处理器,如onclick。...方法被用来创建事件,然后通过initEvent方法初始化,最后使用dispatchEvent触发,虽然现在已经不推荐使用这种方法,但了解它有助于处理老旧代码。

    49910

    小程序中点击子元素事件而不触发父元素的点击事件

    在测试小程序的时候,发现了这样的一个bug,点击子元素事件d的时候触发父元素的点击事件,从而执行父级的点击事件,跳转到了父级的点击事件的页面了。...其实很简单,只需要把子级的bindtap改成catchtap,就可以了。...因为: bind事件绑定不会阻止冒泡事件向上冒泡 catch事件绑定可以阻止冒泡事件向上冒泡 当点击子集的catchtap='navmap'事件之后阻止冒泡事件向上冒泡,所以不会触发bindtap=...'carState',成功解决bug,实现小程序中点击子元素事件而不触发父元素的点击事件。...坚持总结工作中遇到的技术问题,坚持记录工作中所思所见,对于博客上面有不会的问题

    70700

    如何在十分钟内创建一个Chrome 插件

    曾经想过制作自己的Chrome扩展,却因为觉得过程太复杂而打消了念头吗? 好消息,事情并没有你想象的那么复杂!...version:一个到四个用点分隔的整数,用于标识扩展的版本。 description:一个纯文本字符串(不包含 HTML,最多 132 个字符),用于描述扩展。...content_scripts:此键静态地指定每次打开与 URL 模式(由 matches 键指定)匹配的页面时要使用的 JavaScript 或 CSS 文件。...步骤3:创建 Content Script Chrome 扩展中的 Content Script 是运行在网页上下文中的 JavaScript 文件。...如果存在,它会禁用发送按钮并向聊天框的父 div 添加一个 CSS 类(forbidden-div)。 脚本最后注册了两个事件监听器: 第一个触发在 keyup 事件上。

    2K51

    谷歌插件之一键关闭同域名页面

    name "name": "Close Same Domain Tabs" 描述:插件的名称,将显示在Chrome扩展管理页面和插件商店中。...字段: matches:指定内容脚本匹配的URL模式。 js:指定注入的JavaScript文件。...事件处理:使用 chrome.action.onClicked.addListener 监听器,可以捕获用户点击插件图标的事件,并执行相应的操作。...监听和响应外部消息 消息通信:可以通过 chrome.runtime.onMessage.addListener 监听器来接收来自其他插件页面或者内容脚本的消息,实现插件内部的通信和协调。...项目实现 打开chrome://extensions/。 点击“加载已解压的扩展程序”按钮,选择项目文件夹。 插件加载后,在浏览器工具栏会出现插件的图标。

    38910

    写html页面没意思,来挑战chrome插件开发

    谷歌浏览器插件开发是指开发可以在谷歌浏览器中运行的扩展程序,可以为用户提供额外的功能和定制化的体验。谷歌浏览器插件通常由HTML、CSS和JavaScript组成,非常利于前端开发者。...清单文件是插件的配置文件,包含插件的名称、版本、描述、权限以及其他相关信息。背景脚本用于处理插件的后台逻辑,而内容脚本则用于在网页中执行JavaScript代码。...image.png 道歉信内容自己写哈,这个具体看你的诚意。下面设置2个按钮,原谅和不原谅。点击原谅,就可以关闭弹窗。点击不原谅,这个弹窗调整css布局位置继续显示。...页面之间进行数据通信 如需将单条消息发送到扩展程序的其他部分并选择性地接收响应,请调用 runtime.sendMessage()[7] 或 tabs.sendMessage()[8]。...通过这些方法,您可以从内容脚本向扩展程序发送一次性 JSON 可序列化消息,或者从扩展程序向内容脚本发送。如需处理响应,请使用返回的 promise。

    1.3K11

    谷歌插件之页面标记

    name "name": "Close Same Domain Tabs" 描述:插件的名称,将显示在Chrome扩展管理页面和插件商店中。...字段: matches:指定内容脚本匹配的URL模式。 js:指定注入的JavaScript文件。...扩展功能的初始化和处理 初始化任务:通过 chrome.runtime.onInstalled.addListener 监听器,可以在插件安装时执行初始化任务,如设置默认值、注册默认设置等。...事件处理:使用 chrome.action.onClicked.addListener 监听器,可以捕获用户点击插件图标的事件,并执行相应的操作。...监听和响应外部消息 消息通信:可以通过 chrome.runtime.onMessage.addListener 监听器来接收来自其他插件页面或者内容脚本的消息,实现插件内部的通信和协调。

    40210

    Chrome 89 更新事件触发顺序,导致99%的文章都错了(包括MDN)

    id=174288 中,有人指出,在 webkit 中当前的事件模型,会导致含有 Shadow DOM 的情况下,子元素的捕获事件会优先于父元素的捕获事件触发。 ?...而在旧模型中,一旦达到 AT_TARGET ,所有注册的监听器就将按照顺序被触发,而不管他们是否被标记为捕获。由于 Shadow DOM 会创建多个 targets ,导致了事件执行顺序的错误。...1.按照旧版本事件触发机制 表现 目标元素触发事件顺序和注册事件顺序有关 2.新的的事件触发机制 表现 目标元素触发事件顺序按照先捕获再冒泡的顺序触发 而这个版本分界线是在 Chrome 89.0.4363.0...在 Chrome 89.0.4363.0 以及之后版本中,目标元素的触发事件顺序不再按照注册顺序触发!而是按照先捕获再冒泡的形式依次执行! 然后我们再来看看这样修改会给我们带来怎么样的影响。...首先我们要明确是的,网上以前的大部分文章已经不适用于当下的 Chrome 新版本了! 如果我们业务中有依赖相关的事件触发顺序,请仔细检查! 举个?

    71550

    一天学会Chrome插件开发

    Chrome插件就是一个网站类的应用,它是用html、javascript、css组成的一个webapp; 相比于通常的webapp, Chrome插件还可以调用更多浏览器层面的api,包括书签、历史记录...菜单下的扩展程序(E),进入相同的页面)。...单击加载正在开发的扩展程序…,弹出文件选择对话框。 浏览至您的扩展程序文件所在的目录,并选定。...您也可以将扩展程序文件所在的目录拖放到浏览器中的 chrome://extensions 上加载它。 如果扩展程序有效的话,它将被加载并且立刻处于活动状态!...如果无效的话,页面顶部将显示错误消息,请纠正错误再重试。 打包发布 开发插件的目的是为了贡献自己的一点技术力量,为人类的永恒与和平略尽绵力,当然这都是胡扯!

    1.1K50

    如何快速地开发一个chrome扩展插件

    说到现如今最流行的浏览器,那么一定是chrome,无论是它的速度,还是它的稳定性,还是它的简洁,都让人爱不释手,此外,更多的人选择它的理由是它有着丰富的扩展插件,这些扩展插件让你的浏览器变得异常强大,让你的浏览器不仅仅是浏览器...chrome扩展结构 chrome的扩展是以.crx结尾的安装包,如果你把它下载下来,并把它重命名为.rar压缩包文件,然后你就可以使用压缩软件对它进行解压,加压之后,就会发现其实chrome的扩展包里面就是一些...每一个扩展都有一个被浏览器运行的背景页,此外还有事件页面,背景页面是一直都是激活状态,而事件页面只是在触发事件的时候才会激活,因此为了节省内存和提高浏览器的性能,尽可能选择事件页面。...() { } ); 扩展能够做什么 扩展能够做什么主要取决于浏览器为我们提供了哪些API,庆幸的是,chrome为我们提供了足够多好用的API。...我们可以操作用户的书签和浏览记录 我们可以控制下载,管理下载内容 我们可以监听网络请求,监听事件响应 我们可以修改界面样式,可以添加自定义css 我们可以在页面添加想要的元素 总之,chrome几乎为我们提供了完整控制浏览器的扩展

    99720

    【Chrome】931- 何从零开始开发一个 Chrome 插件?

    另外,background拥有的权限比较高,几乎可以调用所有的Chrome扩展API(除了devtools),同时拥有直接跨域的能力。 page:指定一个网页为后台页面。..."content_scripts": [ { // 在匹配的URL中运行,表示所有的URL都会运行。...,首先得查找要给哪个tab发消息,使用chrome.tabs.query 这个方法查找到tab,再使用chrome.tabs.sendMessage 方法给tab发消息: // {active: true...3.如果popup和background都监听了从content发来的消息,两者都能收到监听消息,但是callback只会触发一次,被谁触发取决与谁先发送。...但是,很多用户触发的事件,需要通过inject-scripts告诉content-scripts,content-scripts再给background通信并且去做一些事情,然后再发消息告诉inject-scripts

    2.2K60

    进阶|Chrome还不够神,但你写的扩展程序可以很神

    对于前端工程师而言,其最大的便利就是我们可以应用我们熟悉的 HTML、CSS 、 Javascript 等技术来制作扩展程序。...扩展(Extension) 指的是通过调用 Chrome 提供的 Chrome API 来扩展浏览器功能的一种组件,工作在浏览器层面,使用 HTML + Javascript 语言开发。...chrome扩展程序将后台网页分为两种类型: 1.持续运行的后台网页 2.事件页面 是否持久存在是事件页面与后台网页之间的根本区别。...事件页面只在需要时加载,当事件页面不活动时就会卸载,以便释放内存和其他系统资源,所以一般而言是推荐使用事件页面。 它存在的目的在于,在扩展的整个生命周期内需要长时间管理一些任务或状态。...它的主要功能及适用场景,大致如下: 1.事件页面监听的某个事件触发 2.应用或扩展程序第一次安装或者更新到新版本(为了注册事件) 3.内容脚本或其他扩展程序发送消息 4.扩展程序中的其他视图调用了

    1.6K20

    如何实现一个谷歌浏览器插件

    如何实现一个谷歌浏览器插件 一、什么是Chrome插件? ★Chrome插件就是我们运行在Chrome浏览器 上的扩展程序,比如说vue-devtool。...准确的说,其实更应该叫做Chrome扩展,因为插件是更偏向于底层的技术。Chrome插件本质上来说,就是利用WEB开发技术,包括HTML、CSS和JS等开发出来的web页面,用来增强浏览器的功能。..."48": "img/icon.png", // 显示在扩展程序管理页面上 "128": "img/icon.png" // 在安装和Chrome Webstore...// document_start: html解析完毕、CSS资源加载完成,JS执行前 // document_end: DOMContentLoaded事件触发后立即执行...,对象的话可以JSON序列化 function: background接受到消息后返回的信息 (2)background向content-scripts发送消息 每个tab页面都有一个自己的content-scripts

    1.9K31

    简单说 如何做一个chrome 去广告插件

    说明 Chrome插件又称为谷歌浏览器插件,是谷歌Chrome浏览器的扩展插件,使用Chrome插件可以为Chrome浏览器带来一些功能性的扩展,进而提高Chrome的使用体验。...解释 这次做的这个插件真的很简单,不涉及什么加密解密,也不是去拦截特定的网络请求,就是用CSS的 display: none; 就可以了。 ?...,在Chrome18之后,都是2 version :插件的版本号 description:插件描述 browser_action:设置扩展信息栏的图标、图标悬浮提示、点击图标时弹出窗口,我这里设置了设置的是默认图标...如果需要所有页面都注入,就写成"matches": "", content_scripts 中的 js属性定义要注入的 JavaScript csdn.js 文件内容 var...首先,打开chrome 浏览器,点击右上角的东西,不一定是像图中的三个 · 一样的东西,总之点击最右上角,出现一个弹框就行。 ? 选择更多工具,点击 扩展程序 ?

    1.7K40

    基于Chrome扩展的浏览器可信事件与网页离线PDF导出

    基于Chrome扩展的浏览器可信事件与网页离线PDF导出 Chrome扩展是一种可以在浏览器中添加新功能和修改浏览器行为的软件程序,我们可以基于Manifest规范的API实现对于浏览器和Web页面在一定程度上的修改...JavaScript事件 既然我们的目标是自动操作浏览器执行复制操作,那么可供自动化操作的选择有很多例如Selenium、Puppeteer,都是可以考虑的方案。...因此我们在控制台中执行的命令被认为是浏览器的可信命令,是用户主动触发的事件,而在扩展中执行的不是用户主动触发的事件,进而命令执行失败。...Chrome.debugger API可以作为Chrome的远程调试协议的另一种传输方式,使用chrome.debugger可以连接到一个或多个标签页来监控网络交互、调试JavaScript、修改DOM...此时我们可以发现是可以正常触发事件的,这里实际上就同样表明了通过DevToolsProtocol协议直接执行事件是完全以用户主动触发的形式来进行的,其本身就是可信的事件源。

    61410

    Chrome插件manifest.json文件详解

    Chrome18开始必须为2 "manifest_version": 2, // 描述。132个字符以内 "description": "", // 扩展图标。...不需要人为指定 "key": "", // 扩展所需chrome的最小版本 "minimum_chrome_version": "1.0", // 消息与本地处理模块映射...用于响应地址栏的输入事件 "omnibox": { "keyword": "myKey" }, // 选项页。.... icons 插件的图标; 6. browser_action 定义插件的图标后,点击图标时弹出的页面,以及插件的标题,建议始终保留一个,不设置这个属性图标会是灰色的,设置了后才会亮起来; 7. background...背景页,扩展进程的背景运行环境,可以拦截修改请求等等; 8. content_scripts 内容脚本,可以指定在什么时机向什么页面插入什么脚本或者css资源; 9. permissions 权限申请项

    2.4K20
    领券