![](https://img-blog.csdnimg.cn/20201014180756919.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
浏览器
浏览器相关总结
Bliss_妍
这个作者很懒,什么都没留下…
展开
-
Web端即时通讯的方法
实现即时通讯主要有四种方式,它们分别是轮询、长轮询(comet)、长连接(SSE)、WebSocket。它们大体可以分为两类,一种是在HTTP基础上实现的,包括短轮询、comet和SSE;另一种不是在HTTP基础上实现是,即WebSocket。一、轮询 短轮询的基本思路就是浏览器每隔一段时间向浏览器发送http请求,服务器端在收到请求后,不论是否有数据更新,都直接进行响应。这种方式实现的即时通信,本质上还是浏览器发送请求,服务器接受请求的一个过程,通过让客户端不断的进行请求,使得客户端能够..原创 2020-09-06 13:34:34 · 300 阅读 · 0 评论 -
同域和跨域页面通信方法
一、同域下页面之间的通信该条件下实现的方式比较多,先列举几种典型的方法,然后举例说明其中几种。1、iframe标签可以嵌套另一个标签,并且可以通过js去访问被包含的页面的window对象,从而操作该页面下documentElement;2、使用H5中的webstorage来实现,利用localeStorage和sessionStorage存储进行数据通信;3、使用cookie,读取相同域名下的cookie值来进行通信;4、Window.name通信。(有专门的文章进行讲解)例子1:有一个源窗口原创 2020-08-28 10:45:02 · 1811 阅读 · 0 评论 -
浏览器渲染过程
1.根据html文件构建DOM树和CSSOM树。构建DOM树期间,如果遇到JS,阻塞DOM树及CSSOM树的构建,优先加载JS文件,加载完毕,再继续构建DOM树及CSSOM树。2.构建渲染树(Render Tree)。3.页面的重绘(repaint)与重排(reflow,也有称回流)。页面渲染完成后,若JS操作了DOM节点,根据JS对DOM操作动作的大小,浏览器对页面进行重绘或是重排。...原创 2020-08-24 16:10:59 · 156 阅读 · 0 评论 -
localStorage、sessionStorage 和 Cookie 区别及用法
基本概念cookie:主要用于保存登陆信息,比如登陆某个网站市场可以看到'记住密码’,这就是通过在cookie中存入一段辨别用户身份的数据来实现的。sessionStorage:会话,是可以将一部分数据在当前会话中保存下来,刷新页面数据依旧存在。但是页面关闭后,sessionStorage中的数据就会被清空。localStorage:是HTML5标准中新加入的技术,当然早在IE6时代就有一个userData的东西用于本地存储,而当时考虑到浏览器的兼容性,更通用的方案是使用flash。如今localSt原创 2020-08-21 17:35:02 · 152 阅读 · 0 评论 -
WebSocket
STOMP简单文本定向消息协议,它提供了一个可互操作的连接格式,允许STOMP客户端与任意STOMP消息代理(Broker)进行交互。STOMP协议由于设计简单,易于开发客户端,因此在多种语言和多种平台上得到广泛地应用。一、创建STOMP客户端1、在web浏览器中使用普通的Web SocketSTOMP javascript 客户端会使用ws://的URL与STOMP 服务端进行交互。为了创建一个STOMP客户端js对象,你需要使用Stomp.client(url),而这个URL连接着服务端原创 2020-08-18 18:55:10 · 685 阅读 · 0 评论 -
浏览器缓存机制
强缓存强缓存阶段不需要发送HTTP请求。在HTTP/1.0时,使用的是Expires,而HTTP/1.1使用的是Cache-Control。ExpiresExpires即过期时间,存在于服务端返回的响应头中,告诉浏览器在这个过期时间之前可以直接从缓存里面获取数据,无需再次请求,如果过期了就得向服务端发请求。缺点是服务器的时间和浏览器的时间可能并不一致,那服务器返回的这个过期时间可能就是不准确的。Cache-Control它是采用过期时长来控制缓存,对应的字段是max-age。它可以组合非原创 2020-08-17 11:56:17 · 112 阅读 · 0 评论 -
XSS攻击
XSS 攻击是指浏览器中执行恶意脚本(无论是跨域还是同域),从而拿到用户的信息并进行操作。它可以窃取Cookie。监听用户行为,比如输入账号密码后直接发送到黑客服务器。修改 DOM 伪造登录表单。在页面中生成浮窗广告。通常情况,XSS 攻击的实现有三种方式——存储型、反射型和文档型。存储型,就是将恶意脚本存储到了服务端的数据库,然后在客户端执行这些脚本,从而达到攻击的效果。常见的场景是留言评论区提交一段脚本代码,如果前后端没有做好转义的工作,那评论内容存到了数据库,在页面渲染过程中直接执行, 相当于执行原创 2020-08-16 10:48:49 · 172 阅读 · 0 评论 -
CSRF攻击
CSRF跨站请求伪造,指的是黑客诱导用户点击链接,打开黑客的网站,然后黑客利用用户目前的登录状态发起跨站请求。CSRF可能会自动发 GET 请求、自动发 POST 请求或者诱导点击发送 GET 请求。自动发 GET 请求:进入页面后自动发送 get 请求,这个请求会自动带上关于 xxx.com 的 cookie 信息(如果已经在 xxx.com 中登录过)。并且服务器端没有相应的验证机制,它可能认为发请求的是一个正常的用户,因为携带了相应的 cookie,然后进行相应的各种操作,可以是转账汇款以及其他原创 2020-08-16 10:48:22 · 90 阅读 · 0 评论 -
从输入URL到页面呈现发生了什么?
浏览器端的网络请求过程:首先,浏览器会构建请求,请求行包括请求方法、路径和HTTP协议版本。然后查找强缓存,如果命中直接使用,否则进入下一步DNS解析过程。由于我们输入的是域名,而数据包是通过IP地址传给对方的,因此我们需要得到域名对应的IP地址,这个过程需要依赖一个服务系统,这个系统将域名和 IP 一一映射,这个系统就叫做DNS(域名系统),得到具体 IP 的过程就是DNS解析,浏览器提供了DNS数据缓存功能,即如果一个域名已经解析过,那会把解析的结果缓存下来,下次处理直接走缓存,不需要经过 DNS原创 2020-08-06 18:31:41 · 115 阅读 · 0 评论 -
跨域
概念:由于浏览器的同源策略,为了防范跨站脚本的攻击,禁止客户端脚本对不同域下的文件或脚本进行跨站调用资源。同源策略的概念:同源是指“协议+域名+端口”相同,即使不同域名指向同一个IP地址,也非同源。跨域的解决方案(1) jsonp跨域(2) document.domain + iframe跨域(3) location.hash + iframe跨域(4) window.name + iframe跨域(5) postMessage跨域(6) 跨域资源共享(CORS)(7) nginx代理跨域原创 2020-08-16 10:47:08 · 116 阅读 · 0 评论