前端面试最常问的浏览器相关问题有哪些?疫情好转后。迎来一波复工热潮。在这个时候,也是许多小伙伴求职面试的高峰期。因此小编为大家整理了前端面试中常见的浏览器相关问题,众所周知,浏览器的相关问题是前端面试中的基础问题,也是几乎必考的问题。希望大家可以在前端面试前,多刷刷题,准备得更加充分。
10年积累的成都网站设计、网站制作经验,可以快速应对客户对网站的新想法和需求。提供各种问题对应的解决方案。让选择我们的客户得到更好、更有力的网络服务。我虽然不认识你,你也不认识我。但先网站制作后付款的网站建设流程,更有离石免费网站建设让你可以放心的选择与我们合作。
1、为什么会有跨域的问题出现?
跨域,指的是浏览器不能执行其他网站的脚本,它是由浏览器的同源策略造成的,是浏览器对javascript施加的安全限制,防止他人恶意攻击网站。比如一个黑客,他利用 iframe把真正的银行登录页面嵌到他的页面上,当你使用真实的用户名和密码登录时,如果没有同源限制,他的页面就可以通过JavaScript读取到你的表单中输入的内容,这样用户名和密码就轻松到手了。
2、前端安全 XSS、CSRF是什么?
(1)xss:跨站脚本攻击。xss攻击的主要目的是想办法获取目标攻击网站的cookie,因为有了 cookie相当于有了 session。恶意攻击者往 Web页面里插入恶意 Script代码,当用户浏览该网页之时,嵌入其中 Web里面的。Script代码会被执行,从而达到恶意攻击用户的目的,避免采取的措施: 编码、过滤、校验。
(2)csrf:跨站点伪装请求,CSRF攻击者在用户已经登录目标网站之后,诱使用户访问一个攻击页面,利用目标网站对用户的信任,以用户身份在攻击页面对目标网站发起伪造用户操作的请求,达到攻击目的。防御手段:1.尽量使用 POST,限制 GET,2.加验证码
3、浏览器如何加载页面?
从浏览器地址栏的请求链接开始,浏览器通过 DNS解析查到域名映射的 IP地址,成功之后浏览器端向此 IP地址取得连接,成功连接之后,浏览器端将请求信息通过 HTTP协议向此 IP地址所在服务器发起请求,服务器接受到请求之后等待处理,最后向浏览器端发回响应,此时在 HTTP协议下, 浏览器从服务器接收到 text/html类型的代码,浏览器开始显示此 html, 并获取其中内嵌资源地址,然后浏览器再发起请求来获取这些资源,并在 浏览器的 html中显示。
4、script脚本阻塞有什么解决办法?
(1)推迟加载
如果页面初始的渲染并不依赖于 js或者 CSS可以用推迟加载,就是最后在加载 js和 css,把引用外部文件的代码写在最后。
(2)defer延迟加载
在 文 档 解 析 完 成 开 始 执 行 , 并且在DOMContentLoaded事件之前执行完成,会按照他们在文档出现的顺序去下载解析。效果和把 script放在文档最后
之前是一样的。
(3)异步加载
async异步加载:就是告诉浏览器不必等到加载完外部文件,可以边渲染边下载,什么时候下载完成什么时候执行。
5、defer和 async的区别是什么?
有了 async属性,表示后续文档的加载和渲染与 js脚本的加载和执行是并行进行的, 即异步执行;。有了 defer属性,加载后续文档的过程和 js脚本的加载(此时仅加载不执行)是并行进行的(异步),js脚本的执行需要等到文档所有元素解析完成之后,DOMContentLoaded事件触发执行之前。
6、浏览器强制缓存和协商缓存是什么?
强制缓存:是利用 http的返回头中的 Expires或者 Cache-Control两个字段来控制的,用来表示资源的缓存时间。协商缓存:就是由服务器来确定缓存资源是否可用,所以客户端与服务器端要通过某种标识来进行通信,从而让服务器判断请求资源是否可以缓存访问,这主要涉及到下面两组 header字段,这两组搭档都是成对出现的, 即第一次请求的响应头带上某个字段,则后续请求则会带上对应的请求字段, 若响应头没有 Last-Modified或者 Etag字段,则请求头也不会有对应的字段。
7、WEB存储,COOKIES、LOCALSTOGE等的使用规则和区别?
web存储就指的是本地存储,包括 localstorage和 sessionstorage。cookie在浏览器与服务器之间来回传递,cookie只在设置的cookie过期时间之前一直有效,即使窗口或浏览器关闭,cookie数据不能超过 4k。localStorage不把数据发给服务器,仅在本地保存,始终有效, 长期保存,可以达到 5M或更大存储大小。
8、什么是预加载、懒加载?
预加载:提前加载图片,当用户需要查看时可直接从本地缓存中渲染。懒加载:也就是延迟加载。当访问一个页面的时候,先把 img元素或是其他元素的背景图片路径替换成一张大小为 1*1px图片的路径,只有当图片出现在浏览器的可视区域内时,才设置图片真正的路径,让图片显示出来。这就是图片懒加载。
9、服务器如何识别是你在操作,说说思路?
(1)当浏览器首次访问服务器时,服务器会为客户端创建一个session,并通过特殊算法算出一个 sessionID,用来标识该 session对象。
(2)当浏览器再次(session还在有效时间内)向服务器请求资源的时候,浏览器将 sessionID和请求内容一起发送到服务端。服务端通过对比自身存储的 sessionId来判断用户之前是否存在,并返回对应的内容给不同用户。
(3)因为标识符存在内存里,所以当浏览器关闭时,浏览器保存的sessionId就会消失。服务器将匹配失败,默认为此请求是新用户提出的,如上文顺序,重新创建一个 session容器,和相应的唯一 sessionId, 返回给浏览器。
10、浏览器的渲染流程你了解吗?
(1)解析 HTML文件,创建 DOM树
(2)解析 CSS:优先级:浏览器默认设置<用户设置<外部样式<内联样式
(3)将 CSS与 DOM合并,构建渲染树
(4)布局和绘制,重绘和重排。重排:若渲染树的一部分更新,且尺寸变化,就会发生重排;重绘:部分节点需要更新,但不改变其他集合形状。如改变某个元素的颜色,就会发生重绘。
以上就是前端面试最常问的浏览器相关问题,大家都会做吗?如果有什么地方还有疑问,可以对前端知识点进行针对性的查漏补缺。最后希望大家都可以顺利通过前端面试,拿到理想的offer。
分享标题:前端面试最常问的浏览器相关问题
文章分享:http://bjjierui.cn/article/ppeigc.html