起因 故事得从localStorage说起。 html5的本地存储,相信大家都不陌生。将数据以二进制文件形式存储到本地,在当前应用得非常广泛。...然后我就看到请求如潮水渐涨: 但是,请求到1081端口,最新的chrome就崩溃了.....原来iframe嵌套太多,已经到达了浏览器的极限。 防止浏览器崩溃 C盘还未撑满,同志还需努力。...结果是这样的,到达了1.17G大小。 在后续的实验中,我就慢慢的把端口数量与存储的数据调大。 电脑也运行得越来越慢。这是为什么呢?...我观察到,有时候执行localStorage.setItem()后,在文件夹里不一定立即能看到数据文件。...怀疑这些数据会被chrome先放到内存里,以避免重复读写带来的消耗,在空闲或关闭的时机,再写进硬盘里。 但此时,浏览器已经影响到系统了。
起因 故事得从localStorage说起。 html5的本地存储,相信大家都不陌生。将数据以二进制文件形式存储到本地,在当前应用得非常广泛。...然后我就看到请求如潮水渐涨: ? 但是,请求到1081端口,最新的chrome就崩溃掉了…原来iframe嵌套太多,已经到达了浏览器的极限。 防止浏览器崩溃 C盘还未撑满,同志还需努力。怎么办?...里面的数据是这样的: ? 继续实验的黑科技 算了下我的C盘还有空间嘛,那就把端口数量从100增长到200个。 结果是这样的,到达了1.17G大小。 ?...在后续的实验中,我就慢慢的把端口数量与存储的数据调大。 电脑也运行得越来越慢。这是为什么呢? 我观察到,有时候执行localStorage.setItem()后,在文件夹里不一定立即能看到数据文件。...怀疑这些数据会被chrome先放到内存里,以避免重复读写带来的消耗,在空闲或关闭的时机,再写进硬盘里。 但此时,浏览器已经影响到系统了。
应用(扩展)本质上来说就是web页面,它们可以使用所有的浏览器提供的API,从XMLHttpRequest到JSON到HTML5全都有。...从更高的层次来看,我们将使用它来向 Chrome 浏览器声明扩展程序将会做什么,以及为了完成这些任务所需要的权限: { "name": "清除页面广告", "version": "2.0...,放在您创建的目录中,或者 从我的github上拷贝整个项目用作示例。...通过使用标准的DOM,它们可以获取浏览器所访问页面的详细信息,并可以修改这些信息。...通过观察发现,页面广告要不就是出现频率特别高的同类广告(两侧的页游推广),另一类是通过iframe内嵌到页面中的图片。
我常使用的操作系统是 Windows7,为了确保更安全,我安装了卡巴斯基互联网安全防病毒软件。一天我在一个 Web 页面上看到了一段非常有趣的代码,在我看来它不该出现在页面上。...为什么 Facebook 会使用卡巴斯基网站的 js 代码?我立刻意识到是我的反病毒软件做了 MITM,在网页上注入代码来跟踪页面的活动。...并注入 js 代码,在这个图片中我们可以看到更改的 iframe 页代码 KIS 反病毒软件需要从 iframe.html 中读取代码并分析字符串,如果页面有 kasperskylab_antibanner...Avira、Norton、DrWeb 和 Chrome 搭配进行检测,甚至还要安装插件来让反病毒软件可以注入特定数据到页面以完成对页面的检测。...这种方法并不能保证百分之百检出反病毒软件,因为用户可以禁用安装的 Chrome 扩展。 2. 这篇文章的灵感主要来自于远程检测用户反病毒软件。 3. 相关代码可以在 GitHub 上找到。
这个可能有点难理解,且听我慢慢道来 ~ 三方 Cookie 对智能广告的影响 老读者都知道,在之前的文章中,我多次介绍过三方 Cookie 禁用后的影响以及一些解决方案,比如下面几篇文章: 当浏览器全面禁用三方...存储分区 会影响浏览器的所有标准存储 API,包括 LocalStorage、IndexedDB 和 Cookie。在存储分区世界的中,跨第一方存储的信息泄漏将大大减少。...使用 Fenced frames ,我们依然可以显示与访问者兴趣相匹配的广告,但顶级站点是无法从 frame 的 src 属性中推断出用户的兴趣信息的,这个信息只有广告商知道。...如果嵌入的网页是受信任的,还是用 iframe 即可。...兼容性 Chrome 从 97 版本后开始支持,其他浏览器尚未支持,如果需要在 Chrome 中试用,可以开启下面的 flag:
; 通过iframe的src属性由外域转向本地域,跨域数据即由iframe的window.name从外域传递到本地域。...但是不管是从 Memory Cache 中还是从网络请求中获取的数据,浏览器都会显示是从 Service Worker 中获取的内容。...('key', 'value'); // 从 localStorage 获取数据 let data = localStorage.getItem('key'); // 从 localStorage...删除保存的数据 localStorage.removeItem('key'); // 从 localStorage 删除所有保存的数据 localStorage.clear(); // 获取某个索引的...GPU 进程:其实, GPU 的使用初衷是为了实现 3D CSS 的效果,只是随后网页、Chrome 的 UI 界面都选择采用 GPU 来绘制,这使得 GPU 成为浏览器普遍的需求。
请描述一个网页从开始请求道最终显示的完整过程?...一个网页从请求到最终显示的完整过程一般可以分为如下7个步骤: (1)在浏览器中输入网址; (2)发送至DNS服务器并获得域名对应的WEB服务器IP地址; (3)与WEB服务器建立TCP连接; (4)浏览器向...WEB服务器的IP地址发送相应的HTTP请求; (5)WEB服务器响应请求并返回指定URL的数据,或错误信息,如果设定重定向,则重定向到新的URL地址; (6)浏览器下载数据后解析HTML源文件,解析的过程中实现对页面的排版...不同的浏览器内核对网页编写语法的解释也有不同,因此同一网页在不同的内核的浏览器里的渲染(显示)效果也可能不同,这也是网页编写者需要在不同内核的浏览器中测试网页显示效果的原因。...(4)使用iframe之前需要考虑这两个缺点。如果需要使用iframe,最好通过JavaScript动态给iframe添加src属性值,这样可以绕开以上两个问题。 Label的作用是什么?如何使用?
XSS是注入攻击的一种,攻击者通过将代码注入被攻击者的网站中,用户一旦访问访问网页便会执行被注入的恶意脚本。...> 在这里因为src中传入了一个错误的URL,浏览器变回执行onerror属性中设置的javaScript代码。 可以使用功能单引号或者双引号,将用户的输入转成字符串,再渲染到html上。...Lax相对宽松一点,在跨站点的情况下,从第三方站点的链接打开和从第三方站点提交Get的表单都会携带cookie.但是如果在第三方站点中使用Post方法或者通过img、iframe等标签加载的URL,都不会携带...点击劫持 原理 将要攻击的网站通过 iframe 嵌套的方式嵌入自己的网页中,并将 iframe 设置为透明,在页面中透出一个按钮诱导用户点击。点击按钮实际点击的是iframe里面的东西。...举个例子:比如我在b站发了一个视频,我希望别人都给我一键三连,但是很明显很多人都是喜欢白嫖,不会点击一键三连,我就使用iframe,将b站嵌入我的一个网站里面,然后把iframe设置透明,用定位把一个按钮定位到一键三连的位置那里
要知道后台运行的脚本和网页本身的脚本并不在一个进程里,所以直接打开网页审查是看不到这个后台脚本的,如果要调试插件程序的话,要去 extension - inspect views 里面找。...判读我刷了多久:当我从 zhihu.com 域名离到别的域名时(tab.onUpdate),或者当我去到别的 tab(tab.onActivated),或者干脆我焦点不在 chrome 上了(windows.onFocusChanged...或者也可以简单的使用 alert 在 chrome 上面弹窗。...,next_alarm_time 刷到这个时间点就提醒,然后就是以每个域名为 key 的每个域名访问了多少时间的表,虽然逻辑上并不需要用这个字典,但将来可以扩展成特定的网站每天或者每周给予特定的访问时长...idle.onStateChanged 从电脑休眠中苏醒和恢复时,记录一下 idle 状态,同时如果是从休眠到 active 的状态,等同于 windows focus Changed 事件。
)是数据格式 JSON 的一种“使用模式”,可以让网页从别的网域要数据。...根据 XmlHttpRequest 对象受到同源策略的影响,而利用 元素的这个开放策略,网页可以得到从其他来源动态产生的JSON数据,而这种使用模式就是所谓的 JSONP。...所有,通过Chrome查看所有JSONP发送的Get请求都是js类型,而非 XHR。 ?...缺点: 只能使用Get请求 不能注册 success、error 等事件监听函数,不能很容易的确定 JSONP 请求是否失败 JSONP 是从其他域中加载代码执行,容易受到跨站请求伪造的攻击,其安全性无法确保...避免该错误,可以在Safari浏览器中勾选 开发菜单 => 停用跨域限制。或者只能使用服务器端转存的方式实现,因为Safari浏览器默认只支持CORS跨域请求。
02拖放劫持核心思路"拖放劫持"的思路是诱使用户从隐藏的不可见iframe中"拖拽"出攻击者希望得到的数据,然后放到攻击者能控制的另外一个页面中,从而窃取数据。...但是,这些 API 接口在设计时没有考虑很多的安全性问题,导致通过拖拽就可以实现跨域操作。利用拖拽技术,攻击者可以突破很多已有的安全防御措施。利用拖拽技术,攻击者可以轻易将文本注入到目标网页。...另外一种方式是,通过浏览器的 API 接口将 iframe 中的内容拖拽到目标网页的 text area 中,攻击者就可以获得用户网页中存在的敏感信息。...4、拖动函数drag()和施放函数drop()都命名在iframe和textarea中,并不是图片拖动,使用户以为自己在拖动图片,其实拖动的是图片上放的网页资源5、火狐浏览器拖动过程流畅没有问题;IE浏览器在拖动时能明显看出是在拖动网页资源...服务器检查该参数,判断用户身份的真实性。因此成功实施 CSRF 攻击的关键因素是正确获取 token 值,攻击者需要将载入目标网页 iframe 中 token 自动添加攻击者可控组件后面。
从Gecko 1.9开始,文件使用了更细致的同源策略,只有当源文件的父目录是目标文件的祖先目录时,文件才能读取另一个文件。...X-Frame X-Frame-Options 响应头有三个可选的值: DENY 页面不能被嵌入到任何iframe或frame中 SAMEORIGIN 页面只能被本站页面嵌入到iframe或者frame...CSS 注入 CSS注入最早开始于利用CSS中的 expression() url() regex() 等函数或特性来引入外部的恶意代码,但是随着浏览器的发展,这种方式被逐渐禁用,与此同时,出现了一些新的攻击方式...Abusing Unicode Range 当可以插入CSS的时候,可以使用 font-face 配合 unicode-range 获取目标网页对应字符集。...基于存储 有时候网站会将信息存储在Cookie或localStorage,而因为这些数据一般是网站主动存储的,很多时候没有对Cookie或localStorage中取出的数据做过滤,会直接将其取出并展示在页面中
02 拖放劫持核心思路 "拖放劫持"的思路是诱使用户从隐藏的不可见iframe中"拖拽"出攻击者希望得到的数据,然后放到攻击者能控制的另外一个页面中,从而窃取数据。...但是,这些 API 接口在设计时没有考虑很多的安全性问题,导致通过拖拽就可以实现跨域操作。利用拖拽技术,攻击者可以突破很多已有的安全防御措施。 利用拖拽技术,攻击者可以轻易将文本注入到目标网页。...另外一种方式是,通过浏览器的 API 接口将 iframe 中的内容拖拽到目标网页的 text area 中,攻击者就可以获得用户网页中存在的敏感信息。...4、拖动函数drag()和施放函数drop()都命名在iframe和textarea中,并不是图片拖动,使用户以为自己在拖动图片,其实拖动的是图片上放的网页资源 5、火狐浏览器拖动过程流畅没有问题;IE...服务器检查该参数,判断用户身份的真实性。因此成功实施 CSRF 攻击的关键因素是正确获取 token 值,攻击者需要将载入目标网页 iframe 中 token 自动添加攻击者可控组件后面。
大家好,我是 ConardLi。 跨域隔离环境 在之前的文章中我经常提到一个臭名昭著的漏洞:Spectre 漏洞,详细可以了解下面这篇文章: 通过几行 JS 就可以读取电脑上的所有数据?...一些 Web API 会增加诸如 Spectre 等旁道攻击的风险,比如要利用 Spectre,攻击者需要精确测量从内存中读取某个值所需的时间,所以需要一个可靠且准确的计时器。...如何部署 COEP 可以看我这篇文章: 新的跨域策略:使用COOP、COEP为浏览器创建更安全的环境 启用跨域隔离环境的挑战 虽然跨域隔离环境为网页带来了更好的安全性和启用强大功能的能力,但部署 COEP...同样的,诸如 LocalStorage、CacheStorage、IndexedDB、等存储 API 都会在新的临时分区中加载和存储数据。分区的范围是我们的顶层站点和 iframe 的来源。...演示站点: https://anonymous-iframe.glitch.me/ 如何试用 Chrome 从 106 到 108 版本会开始匿名 iframe 的试用,如果你迫不及待的话可以用下面的方法试用
回答: 我认为 html 语义化主要指的是我们应该使用合适的标签来划分网页内容的结构。html 的本质作用其实就是定义网页文档的结构, 一个语义化的文档,能够使页面的结构更加清晰,易于理解。...(4)重要内容不要用 js 输出:爬虫不会执行 js 获取内容 (5)少用 iframe:搜索引擎不会抓取 iframe 中的内容 (6)非装饰性图片必须加 alt (7)提高网站速度:网站速度是搜索引擎排序的一个重要指标...第三种方式是使用 localStorage 的方式,我们可以在一个标签页对 localStorage 的变化事件进行监听,然后当另一个标签页 修改数据的时候,我们就可以通过这个监听事件来获取到数据。...详细的资料可以参考: 《WebSocket 教程》 《WebSocket 协议:5分钟从入门到精通》 《WebSocket 学习(一)——基于 socket.io 实现简单多人聊天室》 《使用 Web...(3)纯 js 实现,判断一个点在不在圆上的简单算法,通过监听文档的点击事件,获取每次点击时鼠标的位置,判断该位置是否在我 们规定的圆形区域内。
支持 IE10+ 三、获取 iframe 中的内容 1、获取 iframe var iframe = document.getElementById("iframe1"); 2、iframe.contentWindow...['name']; 四、在 iframe 中获取父级内容 ?...当然,这里只是使用 reload 进行获取,也可以添加 iframe 和删除 iframe 的方式,进行发送信息,这些都是根据具体场景应用的。...为了防止网站被钓鱼,可以使用 window.top 来防止你的网页被 iframe,即限定你的网页不能被嵌套在任何网页内: //iframe2.html if(window !...> 这样会对iframe页面进行一系列的限制: script 脚本不能执行 不能发送 ajax 请求 不能使用本地存储,即 localStorage,cookie 等 不能创建新的弹窗和
支持 IE10+ 三、获取 iframe 中的内容 1、获取 iframe var iframe = document.getElementById("iframe1"); 2、iframe.contentWindow...']; 四、在 iframe 中获取父级内容 ?...当然,这里只是使用 reload 进行获取,也可以添加 iframe 和删除 iframe 的方式,进行发送信息,这些都是根据具体场景应用的。...为了防止网站被钓鱼,可以使用 window.top 来防止你的网页被 iframe,即限定你的网页不能被嵌套在任何网页内: //iframe2.html if(window !...> 这样会对iframe页面进行一系列的限制: script 脚本不能执行 不能发送 ajax 请求 不能使用本地存储,即 localStorage,cookie 等 不能创建新的弹窗和
如果用户的登录状态是记录在 Session 中的,要实现共享登录状态,就要先共享 Session,比如可以将 Session 序列化到 Redis 中,让多个应用系统共享同一个 Redis,直接读取 Redis...Chrome 浏览器还给 Cookie 新增了一个 SameSite 属性,此举几乎禁止了一切跨域请求的 Cookie 传递(超链接除外),并且只有当使用 HTTPs 协议时,才有可能被允许在 AJAX...不过,在前后端分离的情况下,完全可以不使用 Cookie,我们可以选择将 Session ID (或 Token )保存到浏览器的 LocalStorage 中,让前端在每次向后端发送请求时,主动将 LocalStorage...关键代码如下: // 获取 token var token = result.data.token; // 动态创建一个不可见的iframe,在iframe中加载一个跨域HTML var iframe...Token 写入到了多个域下的 LocalStorage 中,前端每次在向后端发送请求之前,都会主动从 LocalStorage 中读取 Token 并在请求中携带,这样就实现了同一份 Token 被多个域所共享
领取专属 10元无门槛券
手把手带您无忧上云