Browser
关注
分享
扫一扫
文章平均质量分 81
Browser
WindRunnerMax
这个作者很懒，什么都没留下…
展开
-
服务端SSE数据代理与基于fetch的EventSource实现
是一种由服务器单向推送实时更新到客户端的方案，基本原理是客户端通过HTTP请求打开与服务端的持久连接，服务端可以通过该连接连续发送事件数据。SSE适用于需要持续更新数据的应用，如实时通知、消息推送和动态内容更新，相比于WebSocket的数据通信方案更加轻量，SSE更易于实现且更适合简单的单向数据流场景。原创 2024-11-12 10:19:18 · 969 阅读 · 0 评论 -
MutationObserver对象
MutationObserver (W3C DOM4)对象提供了监视对DOM树所做更改的能力，其被设计为旧的Mutation Events功能的替代品(该功能是DOM3 Events规范的一部分)。原创 2022-08-14 10:59:15 · 559 阅读 · 0 评论 -
IntersectionObserver对象
IntersectionObserver对象IntersectionObserver对象，从属于Intersection Observer API，提供了一种异步观察目标元素与其祖先元素或顶级文档视窗viewport交叉状态的方法，祖先元素与视窗viewport被称为根root，也就是说IntersectionObserver API，可以自动观察元素是否可见，由于可见visible的本质是，目标元素与视口产生一个交叉区，所以这个API叫做交叉观察器，兼容性https://caniuse.com/?sea原创 2021-11-22 11:01:51 · 885 阅读 · 0 评论 -
Event对象
Event对象Event对象表示在DOM中出现的事件，在DOM中有许多不同类型的事件，其主要使用基于Event对象作为主接口的二次接口，Event对象本身包含适用于所有事件的属性和方法。描述事件有很多类型，一些事件是由用户触发的，例如鼠标或键盘事件，而其他事件常由API生成，例如指示动画已经完成运行的事件，视频已被暂停等等，事件也可以通过脚本代码触发，例如对元素调用HTMLElement.click()方法，或者定义一些自定义事件，再使用EventTarget.dispatchEvent()方法将自定原创 2021-02-07 17:19:28 · 341 阅读 · 0 评论 -
HTMLElement对象
HTMLElement对象任何HTML元素都继承于HTMLElement对象，一些元素直接实现这个接口，而另一些元素通过多层继承来实现它。属性从其父元素Element继承属性，并从DocumentAndElementEventHandlers、ElementCSSInlineStyle、GlobalEventHandlers、HTMLOrForeignElement和TouchEventHandlers实现这些属性。HTMLElement.accessKey: 获取/设置元素访问的快捷键。HTM原创 2021-02-04 21:47:12 · 1349 阅读 · 0 评论 -
Element对象
Element对象Element是一个通用性非常强的基类，所有Document对象下的对象都继承自它，这个对象描述了所有相同种类的元素所普遍具有的方法和属性，一些接口继承自Element并且增加了一些额外功能的接口描述了具体的行为，例如HTMLElement接口是所有HTML元素的基本接口，而SVGElement接口是所有SVG元素的基础，大多数功能是在这个类的更深层级的接口中被进一步制定的。属性所有属性继承自它的祖先接口Node，并且扩展了Node的父接口EventTarget，并且从ParentN原创 2021-01-31 14:46:37 · 991 阅读 · 1 评论 -
Navigator对象
Navigator对象Navigator对象表示用户代理的状态和标识，其允许脚本查询它和注册自己进行一些活动，可以使用只读的window.navigator属性取得实例化的navigator对象的引用。属性navigator.connection: 只读，提供一个Network Information对象，该对象包含有关设备网络连接的信息。navigator.cookieEnabled: 只读，如果启用cookie则返回true，否则返回false。navigator.credentials:原创 2021-01-26 11:49:19 · 1181 阅读 · 0 评论 -
History对象
History对象History对象允许操作浏览器的曾经在标签页或者框架里访问的会话历史记录。属性history.length: 只读，返回一个整数，该整数表示会话历史中元素的数目，包括当前加载的页，例如在一个新的选项卡加载的一个页面中，这个属性返回1。history.scrollRestoration: 允许Web应用程序在历史导航上显式地设置默认滚动恢复行为，此属性可以是自动的auto或者手动的manual。history.state 只读，返回一个表示历史堆栈顶部的状态的值，这是一种可以不原创 2021-01-23 19:56:58 · 324 阅读 · 0 评论 -
Node对象
Node对象Node是一个接口，各种类型的DOM API对象会从这个接口继承，其允许我们使用相似的方式对待这些不同类型的对象。属性Node.prototype.baseURI: 只读，返回一个表示base URL的DOMString，不同语言中的base URL的概念都不一样，在HTML中base URL表示协议和域名，以及一直到最后一个/之前的文件目录。Node.prototype.baseURIObject: 只读的nsIURI对象表示元素的base URI(不适用于网页内容)。Node.p原创 2021-01-19 16:50:04 · 351 阅读 · 0 评论 -
浏览器本地存储方案
浏览器本地存储方案浏览器本地存储方案可以分为三个方面，分别为Cookie、Web Storage、IndexedDB。Cookie由于HTTP协议是无状态的，一旦数据交换完毕，此次链接就会关闭，再次交换数据就需要重新连接，意味着服务器无法从链接上跟踪会话。假如A与B同时购买了一件商品，不进行会话跟踪的话服务器就无法判断究竟是谁购买了此商品。服务端为进行会话跟踪，给每个客户端颁发一个通行证，每个人访问必须携带通行证，这样服务端就能区别用户身份了。Cookie实际上是一小段的文本信息，服务端将需要通行证原创 2021-01-14 15:38:31 · 438 阅读 · 0 评论 -
SSRF服务器端请求伪造
SSRF服务器端请求伪造SSRF服务端请求伪造漏洞，也称为XSPA跨站端口攻击，是一种由攻击者构造一定的利用代码导致服务端发起漏洞利用请求的安全漏洞，一般情况下SSRF攻击的应用是无法通过外网访问的，所以需要借助目标服务端进行发起，目标服务器可以链接内网和外网，攻击者便可以通过目标主机攻击内网应用。描述SSRF是利用漏洞伪造服务器端发起请求，从而突破客户端获取不到数据限制，通常攻击者通过伪造服务器请求与内网进行交互，从而达到探测内网，对内网进行攻击的目的，通常与多种攻击方式相结合。服务器端请求伪造攻击原创 2020-12-20 11:16:42 · 461 阅读 · 1 评论 -
Location对象
Location对象Location对象表示其链接到的对象的位置URL，所做的修改反映在与之相关的对象上。Document和Window对象都有这样一个链接到Location，分别通过document.location和window.location访问。属性location.href: 包含整个URL的一个DOMString，DOMString是一个UTF-16字符串，由于JavaScript已经使用了这样的字符串，所以DOMString直接映射到一个String。location.protoc原创 2020-12-06 10:38:02 · 544 阅读 · 0 评论 -
Document对象
Document对象Document接口表示任何在浏览器中载入的网页，并作为网页内容的入口，也就是DOM树。DOM树包含了像<body>、<div>这样的元素，以及大量其他元素。Document对象向网页文档本身提供了全局操作功能，接口描述了任何类型的文档的通用属性与方法，根据不同的文档类型(例如HTML、XML、SVG、...)能够使用更多API，此外使用text/html作为内容类型content type的HTML文档，还实现了HTMLDocument接口，而XML和SVG文原创 2020-11-29 11:43:10 · 1387 阅读 · 0 评论 -
domReady的理解
domReady的理解domReady是名为DOMContentLoaded事件的别称，当初始的HTML文档被完全加载和解析完成之后，DOMContentLoaded事件被触发，而无需等待样式表、图像和子框架的完全加载。描述浏览器渲染DOM结构是有一定顺序的，虽然不同浏览器的实现各有不同，但是基本流程都大致相同：自上而下，首先解析HTML标签，生成DOM Tree。在解析到<link>或者<style>标签时，开始解析CSS，生成CSSOM，值的注意的是此时解析HTML标原创 2020-09-21 16:41:53 · 1356 阅读 · 0 评论 -
CDN缓存的理解
CDN缓存的理解CDN即内容分发网络Content Delivery Network，CDN的基本原理是广泛采用各种缓存服务器，将这些缓存服务器分布到用户访问相对集中的地区或网络中，在用户访问网站时，利用全局负载技术将用户的访问指向距离最近的工作正常的缓存服务器上，由缓存服务器直接响应用户请求，CDN的基本思路是尽可能避开互联网上有可能影响数据传输速度和稳定性的瓶颈和环节，使内容传输的更快、更稳定，通过在网络各处放置节点服务器所构成的在现有的互联网基础之上的一层虚拟网络，CDN系统能够实时地根据网络流量和原创 2020-09-03 12:36:01 · 1060 阅读 · 0 评论 -
GET和POST的区别
GET和POST的区别超文本传输协议HTTP的设计目的是保证客户端与服务端之间的通信，HTTP协议的工作方式是客户端与服务端之间的请求响应，在客户端与服务端进行请求响应时最常用的两种方法就是GET与POST。区别GET是安全的、幂等的，而POST是 不安全的、不幂等的。GET在浏览器回退或者刷新时是无害的，而POST会再次提交数据请求。GET产生的URL地址可以作为书签保存，而POST不行。GET请求会被浏览器主动cache，而POST不会主动缓存。GET请求只能进行url编码，而POST支原创 2020-07-02 12:26:27 · 674 阅读 · 0 评论 -
强缓存与协商缓存
强缓存与协商缓存浏览器缓存是浏览器在本地磁盘对用户最近请求过的资源进行存储，当访问者再次访问同一资源时，浏览器就可以直接从本地磁盘加载资源，通过缓存的方式就可以减少与服务器的数据传输，减少服务器的负担，加快页面响应速度等。描述良好的缓存策略可以降低资源的重复加载提高网页的整体加载速度，通常浏览器缓存策略分为强缓存和协商缓存。常见的HTTP缓存只能存储GET响应，对于其他类型的响应则不会进行缓存。理论上来讲，当一个资源被缓存存储后，该资源应该可以被永久存储在缓存中，由于缓存只有有限的空间用于存储资源副原创 2020-06-14 12:15:57 · 860 阅读 · 0 评论 -
DNS解析过程
DNS解析过程域名是为了方便记忆而专门建立的一套地址转换系统，要访问一台互联网上的服务器，最终还必须通过IP地址来实现，域名解析就是将域名重新转换为IP地址的过程。一个域名对应一个IP地址，一个IP地址可以对应多个域名，所以多个域名可以同时被解析到一个IP地址，域名解析需要由专门的域名解析服务器DNS服务器来完成。解析方式DNS解析查询的方式有两种：递归解析查询和迭代解析查询，通常来说，客户端和本地域名服务器是递归查询，而本地域名服务器和其他域名服务器之间是迭代查询。递归解析假如我们本地客户端是A原创 2020-06-08 11:30:57 · 1346 阅读 · 0 评论 -
SSO单点登录
SSO单点登录SSO单点登录是指在多个应用系统中，用户只需要登录一次就可以访问所有相互信任的应用系统。实例最初的时候，服务的提供者只做了一个单系统，所有的功能都在单系统上，此时不需要SSO，一次登录就可以访问所有功能，后来用户量越来越大且功能服务越来越多，为了合理利用资源和降低耦合性，服务商将功能划分为多个子系统，而子系统的用户登录凭证是相互隔离的，如果在这个子系统登录完成，再访问另一个子系统还需要登录，这显然不太合适，而SSO就是对于这种问题的解决方案，在多个系统中，用户只需要某一个系统中登录，在其原创 2020-05-29 12:22:18 · 1040 阅读 · 0 评论 -
OAUTH开放授权
OAUTH开放授权OAUTH开放授权为用户资源的授权提供了一个安全的、开放而又简易的标准。OAUTH的授权不会使第三方触及到用户的帐号信息例如用户名与密码等，即第三方无需使用用户的用户名与密码就可以申请获得该用户资源的授权，因此OAUTH授权是安全的，目前OAUTH的版本为2.0。实例假如此时有一个网站提供照片的冲印服务并且提供邮递服务，但是用户的所有照片都存储在Google网盘中，此用户如果想冲印大量照片，那么有以下几种解决方案：登录用户自己的Google账号，将所有需要打印的照片下载到本地，然原创 2020-05-25 13:21:31 · 1102 阅读 · 0 评论 -
浏览器窗口间通信
浏览器窗口间通信浏览器多个标签页窗口间通信，主要是指的同源的多个页面间的通信，主要方法有本地存储通信、Web Worker通信、Web Socket通信。本地存储通信通过浏览器对于同源页面本地存储是共享的策略实现通信，主要可以使用localStorage、cookie、indexDB，注意对于sessionStroage是在同一会话有效的，在MDN中提到，通过点击链接或者使用window.open打开的新标签页之间是属于同一个session的，新的标签页会继承上一级会话的sessionStroage，原创 2020-05-17 23:38:58 · 1649 阅读 · 0 评论 -
OSI七层模型
OSI七层模型OSI七层模型包括物理层、数据链路层、网络层、运输层、会话层、表示层、应用层，其中会话层、表示层、应用层一般统称为应用层，在TCP/IP四层模型中物理层与数据链路层归为网络接口层，网络层与运输层是单独的层级，会话层、表示层、应用层归为应用层。物理层物理层的主要任务描述为确定与传输媒体的接口的一些特性，提供用于建立、保持和断开物理连接的机械的、电气的、功能的和过程的条件，也就是说物理层提供有关同步和比特流在物理媒体上的传输手段。信号相关概念单向通信，也称单工通信，只能有一个方向的通信原创 2020-05-10 14:21:24 · 3030 阅读 · 2 评论 -
Window对象
Window对象window作为全局变量，代表了脚本正在运行的窗口，将属性与方法暴露给JavaScript。Window对象属性closed: 表示所引用的窗口是否关闭。console: 提供了向浏览器控制台输出日志信息的方法。crypto: 此对象允许网页访问某些加密相关服务。customElements: 可用于注册新的custom elements，或者获取之前定义过的自定义元...原创 2020-05-07 16:07:50 · 1189 阅读 · 0 评论 -
微信小程序实现原理
微信小程序实现原理微信小程序采用wxml、wxss、javascript进行开发，本质是一个单页应用，所有的页面渲染和事件处理，都在一个页面内进行，但又可以通过微信客户端调用原生的各种接口。微信的架构，是数据驱动视图的MVVM模式，其视图UI和数据是分离的，所有的页面更新，都需要通过对数据的变更来实现。小程序分为两个部分Webview和AppService，Webview主要用来展现渲染界面，A...原创 2020-05-02 15:42:22 · 7840 阅读 · 0 评论 -
HTTP协议发展历程
HTTP协议发展历程HTTP超文本传输协议是一个用于传输超文本文档的应用层协议，它是为Web浏览器与Web服务器之间的通信而设计的，HTTP协议到目前为止全部的版本可以分为HTTP 0.9、HTTP 1.0、HTTP 1.1、HTTP 2.0、HTTP 3.0，其中现在普遍应用的版本是HTTP 1.1版本，正在推进HTTP 2.0版本，以及未来的HTTP 3.0版本。HTTP 0.9HTTP...原创 2020-04-30 14:14:10 · 1353 阅读 · 0 评论 -
RESTful架构与RPC架构
RESTful架构与RPC架构在RESTful架构中，关注点在于资源，操作资源时使用标准方法检索并操作信息片段，在RPC架构中，关注点在于方法，调用方法时将像调用本地方法一样调用服务器的方法。RESTful架构REST即表述性状态传递Representational State Transfer，是一种软件架构风格，也可以称作是一种设计API的模式，REST通过HTTP协议定义的通用动词方法...原创 2020-04-28 14:50:29 · 1239 阅读 · 0 评论 -
浏览器页面呈现过程
浏览器页面呈现过程从输入链接到浏览器呈现页面的过程中，浏览器所经历的过程。DNS解析首先浏览器将输入的链接进行DNS解析，也就是将域名转换为IP地址的过程，得到了服务器具体的IP地址，才可以进行TCP链接以及数据的传输。具体DNS解析的过程，浏览器首先检查自身的DNS缓存是否对于此域名有IP地址，chrome对于域名解析的缓存时间为60s，可以通过地址栏输入chrome://net-int...原创 2020-04-24 11:54:20 · 1629 阅读 · 1 评论 -
浏览器事件
浏览器事件常用浏览器事件与DOM事件，包括鼠标事件、键盘事件、框架/对象事件、表单事件、剪贴板事件、打印事件、拖动事件、多媒体事件、动画事件、过渡事件。浏览器事件加载相关onbeforeunload: 该事件在即将离开页面（刷新或关闭）时触发。onload: 文档加载完成后触发。onunload: 当窗口卸载其内容和资源时触发。onerror: 当发生JavaScript运行时错误...原创 2020-04-20 13:40:41 · 2219 阅读 · 0 评论 -
TCP与UDP异同
TCP与UDP异同TCP/IP模型的运输层有两个不同的协议：UDP用户数据报协议与TCP传输控制协议相同点TCP与UDP都是运行在运输层的协议TCP与UDP的通信都需要开放端口不同点TCPTCP是面向连接的协议，提供全双工通信，需要建立链接之后再传输数据，数据传输负载相对较大。TCP提供可靠交付的服务，使用流量控制和拥塞控制等服务保证可靠通信。TCP首部最小20字节，最大6...原创 2020-04-17 22:56:38 · 1559 阅读 · 0 评论 -
TCP三次握手
TCP三次握手传输控制协议TCP，Transmission Control Protocol是一种面向连接的、可靠的、基于字节流的传输层通信协议，其是运行在OSI七层模型中的运输层，为了在不可靠的互联网络上提供可靠的端到端字节流而专门设计的一个传输协议。三次握手过程client server主动打开 → ...原创 2020-04-12 14:37:32 · 1622 阅读 · 0 评论 -
分布式SESSION一致性
分布式SESSION一致性SESSION是服务器为客户端创建的一个会话，存储用户的相关信息，用以标识用户身份等。在单服务器环境下是不需要考虑会话的一致性的问题的，但是在集群环境下就会出现一些问题，假如一个用户在登录请求时负载均衡到了A服务器，A服务器为其分配了SESSION，下次请求数据时被分配到了B服务器，此时由于B服务器不存在此用户的SESSION，此用户会被重定向到登录页面，这种情况是不合...原创 2020-04-09 22:28:11 · 1324 阅读 · 0 评论 -
对称加密与非对称加密
对称加密与非对称加密在数字加密算法中，可划分为对称加密和非对称加密。对称加密对称加密算法中对于数据的加密与解密使用同一密钥，即使用相同的密码对内容进行加密解密。内容 + 密钥 = 密文密文 - 密钥 = 原文优点加解密速度快，效率高，适合一对一的信息加密传输缺点数据传输前必须协商好密钥，如果任一方密钥被泄漏，那么加密信息就变得不安全了；不适合一对多的情况，若多人共享同一密钥，则...原创 2020-03-29 12:13:52 · 1545 阅读 · 0 评论 -
HTTPS加密传输过程
HTTPS加密传输过程HTTPS全称Hyper Text Transfer Protocol over SecureSocket Layer，是以安全为目标的HTTP通道，在HTTP的基础上通过传输加密和身份认证保证了传输过程的安全性。HTTPS在HTTP的基础下加入SSL层，HTTPS的安全基础是SSL，因此加密的详细内容就需要SSL。知识储备HTTPHTTP是应用层协议，默认运行在80...原创 2020-03-27 12:29:23 · 1981 阅读 · 0 评论 -
CSS劫持攻击
CSS劫持攻击CSS劫持是一种并不很受重视的劫持方式，但是其也有一定的危害，且由于其并不一定需要依赖JavaScript，这使得此种攻击方式更容易实现。ClickJacking点击劫持当访问某网站时，利用CSS将攻击者实际想让你点击的页面进行透明化隐藏，然后在页面后显示 一些东西诱导让你点击，点击后则会在用户毫不知情的情况下做了某些操作，这就是点击劫持ClickJacking。iframe...原创 2020-03-24 11:24:51 · 1902 阅读 · 0 评论 -
HTTP协议概述
HTTP协议概述HTTP超文本传输协议，基于TCP/IP通信协议传输数据特点HTTP是无连接的：无连接的含义是限制每次连接只处理一个请求。服务器处理完客户的请求，并收到客户的应答后，即断开连接，采用这种方式可以节省传输时间。HTTP是媒体独立的：只要客户端和服务器知道如何处理的数据内容，任何类型的数据都可以通过HTTP发送，在HTTP中使用Content-Type来表明资源媒体类型。H...原创 2020-03-23 11:47:59 · 1617 阅读 · 0 评论 -
浏览器重绘与回流
重绘与回流重绘与回流是浏览器渲染的时候进行的操作，当页面内容发生改变的时候，就会触发重绘或者回流重绘当渲染树中的一些元素需要更新属性，而这些属性只是影响元素的外观，风格，而不会影响布局的，比如background-color，则就叫称为重绘Repaint，重绘不一定触发回流。回流当渲染树中的一部分(或全部)因为元素的规模尺寸，布局，隐藏等改变而需要重新构建，这就称为回流Reflow,有些...原创 2020-03-16 12:03:20 · 1695 阅读 · 0 评论 -
浏览器渲染与内核
浏览器渲染与内核浏览器内核可以分成两部分：渲染引擎与JS引擎。最开始渲染引擎与JS引擎并没有明确的区分，但随着JS引擎越来越独立，内核就越来越倾向于只指渲染引擎。渲染过程不同浏览器内核的渲染方式不同，但整体流程基本一致自上而下，首先解析HTML标签，生成DOM Tree在解析到<link>或者<style>标签时，开始解析CSS，生成CSSOM，值的注意的是此时...原创 2020-03-15 11:55:23 · 1552 阅读 · 0 评论 -
XSS跨站脚本攻击
XSS跨站脚本攻击跨站脚本攻击XSS，是最普遍的Web应用安全漏洞。这类漏洞能够使得攻击者嵌入恶意脚本代码到正常用户会访问到的页面中，当正常用户访问该页面时，则可导致嵌入的恶意脚本代码的执行，从而达到恶意攻击用户的目的。类型反射型XSS： 攻击者事先制作好攻击链接,需要欺骗用户自己去点击链接才能触发XSS代码，所谓反射型XSS就是将恶意用户输入的js脚本，反射到浏览器执行。存储型X...原创 2020-03-03 12:31:40 · 1798 阅读 · 0 评论 -
SQL注入
SQL注入SQL注入即是指web应用程序对用户输入数据的合法性没有判断或过滤不严，攻击者可以在web应用程序中事先定义好的查询语句添加额外的SQL语句，从而实现非法操作，获取数据库数据，服务器提权等，很多机构将SQL注入作为第一危险的安全漏洞。原理SQL注入攻击是通过操作输入来修改SQL语句，用以达到执行代码对WEB服务器进行攻击的方法。简单的说就是在post/get表单、输入域名或页面请求...原创 2020-03-05 13:58:51 · 1733 阅读 · 0 评论 -
CSRF跨站请求伪造
CSRF跨站请求伪造跨站请求伪造通常缩写为CSRF或者XSRF，是一种挟制用户在当前已登录的Web应用程序上执行非本意的操作的攻击方法。跟跨网站脚本XSS相比，XSS利用的是用户对指定网站的信任，CSRF利用的是网站对用户浏览器的信任，浏览器对于同一domain下所有请求会自动携带cookie。原理用户A正常打开网站B，并且成功登录获取cookie用户A未退出网站B，在同一个浏览器中打开...原创 2020-03-04 12:46:04 · 1667 阅读 · 0 评论