首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

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

扩展在他们后台脚本中监视这些事件,然后用指定指令进行响应 关于后台脚本状态 首次下载后或者更新后被加载 后台脚本下载后会处于休眠状态,直到它侦听某个事件被触发, 侦听到事件后,会使用指定指令响应...(怎么相应自定义) 以下情况需要调用到后台脚本 扩展首次下载或者版本更新 后台脚本中正在监听事件,并且这事件被触发了 content_script 或者其他扩展中调用了 sendMessage...一般为 false, 某些特殊情况需要参考文档 } } 事件过滤器,有些事件支持事件过滤,比如选项卡切换可以监听 // background.js chrome.webNavigation.onCompleted.addListener..."_execute_browser_action": {...}, "_execute_page_action": {...} } } 操作快捷键后,插件后台监听到对应事件...、修改、重新排列选项卡 webNavigation 请求进行过程中操作权限 webRequest | webRequestBlocking 开放 正在运行请求 拦截、阻塞、或修改权限 15. web_accessible_resources

2.2K20

绕过 CSP 从而产生 UXSS 漏洞

我将实际与你一起浏览代码并向你展示如何跟踪一个扩展程序步骤。 所以整个事情描述较长。...这篇文章将介绍沿途遇到阻力,并展示它们是如何被绕过。 我们将从数据输入位置开始,并一直跟寻到最终触发函数。...现在我们已经通配了那条路由,无论我们链接是什么,它总是路由到一个返回 >1024 字节页面。 解决了这个检查。...但是,它要求用户在我们恶意页面上单击扩展图标。 在构建漏洞利用时最好不要传达弱点存在,因此我们尝试使其不需要用户交互。...第二部分在一秒钟后触发并生成 iframe,chrome-extension 位置://dcfofgiombegngbaofkeebiipcdgpnga/html/popup.html(弹出页面)。

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

css笔记 - 张鑫旭css课程笔记之 overflow 篇

内容尺寸超出了容器尺寸额限制 滚动条宽度机制 滚动条会占用容器可用宽度或高度 IE7/Chrome/FireFox(Win7)下都是17像素 滚动条与body/html关系 无论什么浏览器,默认滚动条均来自...这种现象导致,scrollTop(元素内容高度)计算差异 移动端滚动技能——ios原生滚动回调效果: -webkit-overflow-scrolling:touch; overflow与BFC BFC...、所以形成BFC元素可以清除浮动带来影响,不然的话,子元素浮动,父元素塌陷,父元素兄弟元素和父元素子元素重叠,就违背了bfc初衷,所以要清除浮动带来影响。...可以触发BFCoverflow属性值: scroll、auto、hidden这三个可以触发元素BFC特性。visible不会。...可以触发BFC几种情况分析: overflow: 非visible;有自适应性,但是溢出不可见限制了其使用场景 float + float: 包裹性+破坏性。但是无法自适应。

2.8K10

web前端面试中10个关于css高频面试题,你都会吗?

值不为static或则releative中任何一个 在IE下, Layout,可通过zoom:1 触发 BFC布局与普通文档流布局区别: BFC布局规则: 浮动元素会被父级计算高度(父级元素触发了...BFC) 非浮动元素不会覆盖浮动元素位置(非浮动元素触发了BFC) margin不会传递给父级(父级触发BFC) 属于同一个BFC两个相邻元素上下margin重叠 普通文档流布局: 浮动元素是不会被父级计算高度...非浮动元素覆盖浮动元素位置 margin传递给父级元素 两个相邻元素上下margin重叠 开发中应用 阻止margin重叠 可以包含浮动元素 —— 清除内部浮动(清除浮动原理是两个 div...,而是伪元素,代表一个元素之后最近元素)和 IEhack ,可以完美兼容当前主流各大浏览器,这里 IEhack 指的是触发 hasLayout。...很容易发现, border渲染并不是正方形, 而是梯形. 3. 在增大border基础下, 此时我们将盒子宽高变成0,产生什么效果呢!

2.8K20

深度剖析浏览器渲染性能原理,你到底知道多少

使用 Chrome DevTools Timeline 来分析 JavaScript 性能 打开 Chrome DevTools > Timeline > JS Profile,录制一次动作,然后分析得到细节信息...避免连续强制同步布局发生 如果连续快速多次触发强制同步布局,那么结果更糟糕。...当然纯粹改变元素非几何属性,也可能触发Paint,比如背景、文字颜色、阴影效果等。...减少绘制区域 浏览器会把相邻区域渲染任务合并在一起进行,所以需要对动画效果进行精密设计,以保证各自绘制区域不会有太多重叠。...对用户输入事件处理函数去抖动(移动设备),具体可以做什么? 用户输入事件处理函数会在运行时阻塞帧渲染,并且导致额外布局发生。

1.3K20

设计模式- 责任链模式

从而保证请求不会被多次处理。 应用场景 电脑打开了多个软件窗口(TIM、Chrome、WeChat),三个窗口有重叠部分。实现鼠标选定不同软件窗口。...[点击.png] 分析 上述场景,鼠标的点击事件可以看成一种请求,当点击到某个软件窗口范围内则表示选中该软件。如果点击到软件窗口重叠部分,就默认选中最顶部软件。.../exe Click Chrome! Click WeChat! Click Tim!...使请求能够流动起来,同时能够定制请求被处理依次或多次。其实现方式可根据不同需求有不同设计,关键在于其模式思想。 优点 降低了对象之间耦合度。...职责链建立合理性要靠客户端来保证,增加了客户端复杂性,可能会由于职责链错误设置而导致系统出错,如可能造成循环调用。

31420

C++设计模式 - 责任链模式

当一个请求来时候,当前处理对象不能处理,那就交给下一个处理对象,至于是谁处理无需关心。 另外,请求只要被某个对象处理了,就直接返回,不会继续执行下去。从而保证请求不会被多次处理。...应用场景 电脑打开了多个软件窗口(TIM、Chrome、WeChat),三个窗口有重叠部分。实现鼠标选定不同软件窗口。...分析 上述场景,鼠标的点击事件可以看成一种请求,当点击到某个软件窗口范围内则表示选中该软件。如果点击到软件窗口重叠部分,就默认选中最顶部软件。...使请求能够流动起来,同时能够定制请求被处理依次或多次。其实现方式可根据不同需求有不同设计,关键在于其模式思想。 「优点」 降低了对象之间耦合度。...职责链建立合理性要靠客户端来保证,增加了客户端复杂性,可能会由于职责链错误设置而导致系统出错,如可能造成循环调用。

31810

设计模式

备忘录(快照) 最近公司和三方系统对接需要将系统订单信息同步到三方系统中,订单信息设计到多次支付,多次退款,接口同步涉及到失败情况,比如 一笔订单支付两次 ,部分退款一次 ,第一次成功,第二次失败...,第三次成功,这样三方系统状态会出现不一致,当我们发现状态不一致时候需要回放上一次调用情况重新触发调用,因此每次调用需要有当时快照信息,以便重放。...还未发现使用场景 骨架模式 继承场景一定要确定类和类之间是is a 关系,否则还是要慎用,你永远不知道,你子类是在什么样上下文中使用你父类,尽量减少让子类覆盖方法,必须覆盖场景要写好注释...多用组合少用继承,利用好组合,使用接口,结合静态内部类还可以模拟出多重继承效果 静态构造方法 builder 模式适合多参数情况,重叠构造情况,又不能明确显示出此次对象构建使用场景,而且当类型相同参数导致一些微妙错误...,如果使用者不小心颠倒里其中几个参数顺序,编译还不报错重叠构造函数还有一个确定是他不能重命名(对象功能还是单一点比较好,不过总有无奈情况),使用javabean 可以避免参数顺序问题,但是这样构造过程就由多步组成

37000

在 css 图层分析这方面,Chrome Devtools 属实不太行

没听错,确实是 safari ,不是 chrome devtools,图层分析上 chrome devtools 不太行,具体情况后面说。...3D 转换创建图层是因为会用 GPU 做计算和渲染;position:fixed 创建图层是因为脱离了文档流,而与其他元素重叠创建图层也很好理解,重叠了嘛,一个图层渲染不了,所以在单独图层渲染。...我们梳理下导致图层创建原因: 根元素 有 z-index 是负值子元素 有 3D 转换 position:fixed 与其他元素可能重叠 will-change 样式值为 opacity、transform...当然,Chrome Devtools 在其他调试工具上还是很优秀。...总结 浏览器通过图层来组织不同元素渲染。 3D 转换导致创建图层、元素重叠导致创建图层、will-change 为某些值时会导致创建图层,等等。

61120

如何动态加载js?

s.readyState == 'complete') { callback(); } }; } } 一开始把代码copy过来使用,在ie8和chrome...把IE10设置为兼容IE7模式,就一切正常。看了是IE10新特性照成。那么到底是怎么回事呢?断点跟踪吧。 弄了好久才发现,原来是js文件会被加载多次。 为什么被加载了多次呢?...原来 chrome只会触发 onload, 而不会触发onreadystatechange(不会进入断点)。 而IE7只触发 onreadystatechange,而不会触发onload。...两个都会被触发。 继续解决: 一开始是想做一个标志位。做一个标志,如果callback了就不再次callback。但是实际效果有点不稳定,当然很可能是俺代码没处理好。 于是还是换一种方法吧。...== 'complete') { callback(); } } function loaded() { /*chrome

12.8K50

问题小记

第三个参数为true时候,代表是在捕获阶段绑定;当第三个参数为false或者为空时候,代表在冒泡阶段绑定 结论:event.target指向引起触发事件元素,而event.currentTarget...font-size是16像素 那么如果设置150%行高 最后实际行高会是16像素*150% = 24像素 并且其子孙元素继承这个像素值 长度值   一个元素如果设置了长度值为line-height...em值不固定,继承父级元素字体大小 避免字体大小被重复计算,也就是1.2 * 1.2= 1.44现象 rem:始终是基于根元素 ,是目前比较好解决方法。...word-spacing/letter-spacing: 使用负值,设置负值是和字体大小有关系,但是如果设置过大的话,造成重叠 postCss 详细解释:https://www.ibm.com/developerworks...2、打开页面,自动调起文件选择解决办法 在页面打开时,执行js方法并手动trigger触发inputclick事件,还有视频video自动播放,因为浏览器安全策略而被禁止

66010

Flink学习笔记(6) -- Flink Window和Time详解

tumbling windows:滚动窗口 【没有重叠】   sliding windows:滑动窗口 【有重叠】   session windows:会话窗口 ? ? ? ? ? ? ? ? ?...所以在进行window计算时候,我们又不能无限期等下去,必须要有个机制来保证一个特定时间后,必须触发window去进行计算了。...注意:多并行度情况下,watermark对齐取所有channel最小watermark ? ?   ...注意:如果指定多次watermark,后面指定覆盖前面的值。...如果maxOutOfOrderness设置太小,而自身数据发送时由于网络等原因导致乱序或者late太多,那么最终结果就是会有很多单条数据在window中被触发,数据正确性影响太大。

53110

前端使用 WebSocket 四大注意事项(线上踩坑,含泪分享)

踩坑点我《联机桌游合集》刚上线时,有个使用iOS朋友告诉我,她无法进入游戏,重试了多次也不行。但是我已经用我手头安卓、iPad、iPhone、Mac、Windows全都测试过一遍了。...在Chrome中,触发多次onmessage事件,各个消息是被Chrome基于\n分割开了,分割后消息按顺序依次触发onmessage来处理。...在Safari中,只触发了一次onmessage事件,Safari没有帮我们分隔消息。事实上,在WebSocket消息中,\n换行符本身就是区分消息特殊符号。...如果需要短时间内连续发送多条消息给客户端,一种常见优化手段就是把这些消息一次性发送过去,用\n分割。Chrome很好,帮我们分割好了。...,但如果你要做压力测试,那就可能遇到坑。

1.5K30

开发Chrome插件,实现网站自动登录

和供应商反馈了很多次,都无法彻底解决数据显示问题,没办法,自己周末在家研究,网站自动登录事情。...想到Chrome插件可以解决这个事情,主要原理就是:新开一个页,定时刷新这个页面,检测是否掉线,如果掉线,就触发登录按钮,实现自动登录,这个检测是在后台进行,不能影响前端数据大屏显示信息。...上代码: 一,每隔三秒钟刷新一下页面,检测是否掉线,掉线标准就是loginSystem这个按钮出现在页面上,检测到这个按钮存在,就触发点击事件,这里不需要关心用户名和密码问题,因为已经让浏览器记住用户名和密码了...四,安装配置到Chrome扩展程序。 五,打开要检测掉线网站,看是否自动登录。因网站可能涉及数据泄露,就不发网站示例了,把控制台输出截图展示一下。...程序已正常运转,那个数据大屏展示页,再也不会因掉线出现数据不正确现象了。 以此类推,开发Chrome扩展插件,还可以实现,其他一些功能,比如数据抓取,网站异常报警等。

1.4K30

某宝抢购脚本

该情况导致部分账号无法登录),抢购第四五次触发校验。...该项目使用了读秒方式计算抢购开始时间,抢购以自动化可视化操作提交订单。 优点:解决了登录校验问题,能够完成或多次登录校验。读秒抢购,减少请求次数。...多次提交订单而未完成校验。 反爬虫与应对策略 使用扫码登录并完成多次校验,避免登录过程被反爬。 经过测试发现,chromeselenium疑似规避了反爬虫策略了。...linux系统下使用geckodriver不会触发反爬虫。 由于此处使用webdriver导致抢购速度慢,需要等待页面渲染。requests不便实现 再次使用webdriver弹出校验。...优点:解决登录校验问题,完成或多次登录校验。读秒抢购,减少请求次数。访问速度快,无需渲染。不易触发反爬虫机制。 缺点:requests不便实现 再次使用webdriver弹出校验。

3.2K10

Python 网络爬虫技巧分享:优化 Selenium 滚动加载网易新闻策略

基本思路是模拟用户向下滚动页面,触发页面加载更多内容行为,然后通过 Selenium 提取所需信息。优化滚动加载策略主要包括滚动次数、滚动间隔、加载等待时间等方面的调整。...proxyPort))# 初始化 Chrome WebDriverdriver = webdriver.Chrome(options=chrome_options)# 打开网易新闻首页driver.get...技术细节在上面的代码中,我们首先使用 Selenium Chrome 驱动器启动了一个 Chrome 浏览器,并打开了网易新闻页面。...然后,我们使用 execute_script() 方法执行 JavaScript 代码,将页面滚动到底部以触发滚动加载。通过循环执行这个过程,我们可以多次加载页面并获取更多新闻内容。...异常处理:在实际操作中,可能遇到各种异常情况,比如网络超时、页面结构变化等。在代码中加入异常处理机制,增强程序稳定性。定期更新代码:由于网站可能不断更新页面结构,导致之前爬虫代码失效。

25010

【CSS】410- 关于CSS盒子模型、BFC及其应用

随便写个 div, 打开 Chrome 开发者工具, 在右边栏能看到这样一个直观盒模型图. ?...Box垂直方向距离由margin决定,在一个BFC中,两个相邻块级盒子垂直外边距产生折叠。...在BFC中,每一个盒子左外边缘(margin-left)触碰到容器左边缘(border-left)(对于从右到左格式来说,则触碰到右边缘) 形成了BFC区域不会与float box重叠 计算BFC...BFC主要作用: 清除浮动 防止同一BFC容器中相邻元素垂直方向外边距重叠问题 举例 1. 同一个 BFC 下两个块级元素之间外边距会发生折叠. ?...造成上图原因是因为灰色 div 被蓝色 div 所覆盖, 但文本不会被覆盖, 所以被强行压缩换行. 如果想要避免这种情况, 可以触发灰色 div BFC 特性. ?

61720
领券