原来是8月29号早上接到的一个深圳的电话,还以为是什么广告电话,一说是腾讯的马上一个激灵站起来,什么准备都没有,跟面试官说现在没空,然后约了晚上7点再面试,到晚上7点面试官说临时有会议改到9点再面,到九点多还没打电话过来,短信过去询问,说会议刚结束,改约了30号早上(也是辛苦啊,开到9点多)。
言归正传,第一次接到春招电面,之前看了别人的面经,其实问到的问题其他人的面经都有说到,遗憾没有深入去理解,只是看了个皮毛!而且对一些必问题也没有准备得很好!
下面是面试题:
1. 说说在学习的过程中遇到什么问题,怎么解决的
说了我学框架学相关知识遇到问题都是通过谷歌解决,面试官让说具体的例子,想了好久,面试官也很有耐心在等,最后说我太紧张了现在想不起来。
2.说说JS的作用域
说了JS没有块级作用域,ES6之后才有,作用域嵌套,当嵌套作用域内找不到变量会一直往上找,直到全局作用域。
面试官追问嵌套的作用域是不是一定能拿到外部作用域的变量,我说可以,面试官举了例子:如果嵌套作用域的变量跟嵌套作用域的变量相同呢?那当然就获取不到外部作用域的变量了...
后来好像聊到如果找不到变量会怎么办,口误说了undefined,后来说是会报错,面试官说报什么错,我说 Uncaught
,完整的报错忘记了,后来面试官说是ReferenceError
,后来发现完整的报错就是Uncaught ReferenceError
,也可能是我表述的不清楚。
然后又问了什么时候会报 TypeError
,答当对一个非函数变量做函数调用会报TypeError
3.问是不是学过React
说是,跟面试官说只是在开始实习的时候才接触React,面试官说那说说React的声明周期吧,说了第一次渲染的生命周期,还有Props和State发生改变时的生命周期,还有卸载的生命周期。
问有没有用过Redux,说只是做了简单的了解,跟他扯了一下Flux的dispatch - action - store
...
4.问知不知道缓存方面的东西
之前刷过面经知道会问,一开始就说了HTTP缓存,看他的目的应该是想让我说出浏览器缓存,说了HTTP缓存好像觉得不错,但是抓住HTTP缓存问深了就被问倒了...
说了HTTP缓存分强制缓存和协商缓存
强制缓存有catch-control
和 Expires
,如果浏览器有强制缓存则请求不会到达服务器,直接使用强制缓存, Expires
是HTTP1.0的请求头,catch-control
是HTTP1.1的请求头,会优先判断catch-control
。后面又问了catch-control
的max-age
是干什么的。
然后又提了个问题:为什么有了Expires
又要多一个catch-control
呢?再次被问倒,这确实是个值得思考的问题。
做了搜索,大致原因如下:
Expires
返回的是一个绝对时间,如果客户端和服务端的时间相差较大,比如修改了客户端时间,缓存可能就会被过期用不了了。而cache-control
使用的是一个相对时间max-age=多少秒
,且做比较都是用客户端时间做比较,可靠性比Expires
更高。
回到面试,又说了协商缓存,Etag
和last-modified
,如果没命中强制缓存就会走协商缓存,请求会被发到服务器,判断缓存是否过期,协商缓存面试官没有继续追问。
后面又问了知不知道 浏览器缓存 ,我不确定他说的是不是 cookie、localStorage、sessionStorage这些浏览器存储,跟他说可能我知道这方面的知识点,但是不确定是不是你说的,他说了cookie,就知道了是这方面的东西。
跟他说了cookie大小只有4kb,后面聊到可以用Iframe突破cookie的大小限制,然后就是cookie可以发送到服务器,用来实现记住登录态,购物车功能。
继续说了localStorage,localStorage不会自动删除要手动删除,问localStorage有没有大小限制,似乎有接触到这个问题但是没有留意,再次被问倒...
做了搜索,显然储存毫无疑问一定会有大小限制的,但是当时好像回答的是没有T T,localStorage的大小限制每个浏览器都是不同的,一般都限制在5 - 10M之间。
在面试的过程中面试官除了提问,如果你不懂还会跟你说这方面的知识,非常nice,他说localStorage现在使用非常普遍,比如可以用来做首屏预加载,这个真的没有好好了解过,感觉针对浏览器缓存可以好好了解一下,写一篇文章。cookie的使用场景也是非常多,比如后面聊到的登录验证,防范网络攻击。
5.有没有了解XSS和CSRF
这个真的很可惜啊,聊到XSS的时候没答出来具体的XSS手段和防范措施,这个在别人的面经有看到过会问这个问题,但是没有仔细钻研,大概是回答的最差的一道了。
面试官先问了CSRF,跨站点请求伪造,举了一个恶意邮件打开转账页面的例子,面试官继续追问有什么方法可以预防CSRF,说了可以通过在请求头的Referer字段做检查,这个是之前在维基上看到的,因为Referer字段的作用就是可以知道用户是从哪个域名跳转到上面提到的转账页面的,以此判断是否从恶意网站跳转。面试官说Referer是可以被修改的啊,那怎么办,问倒+10086...,后面面试官继续引导,说可以通过添加校验token的方法,因为转账肯定是一个post请求,可以在每次走正常转账流程的过程中,从服务器获取这个token,当发起转账请求时把token发送过去验证,而伪造请求无法获取到这个token,提交的请求就会少了这个token而验证失败。
后面又问了XSS,跨站脚本攻击,回答了可以通过劫持服务器放回的html,在里面插入一段js实现XSS,面试官说这是劫持攻击...,又问了怎么预防劫持,答不知道,说可以用HTTPS,挖了坑给自己跳..一时也忘记了XSS是怎么攻击的,后来面试官说XSS是最基本最应该知道最常见的一种攻击方法,遗憾,之前的了解不够深入,只能现在补课:
1.在一个没经过转义处理的表单,在里面写一个<script>code...</script>
,表单提交,script标签中的代码被立即执行。利用JS可以获取用户cookie这一点,拿到用户的cookie,从而拿到用户的隐私信息。
2.如果一个论坛的编辑器没有做转义处理,假设你发布了一篇含有<script>code...</script>
的文章,那么所有点开这篇文章的人打开瞬间都会执行这段script脚本。那么就会出现大量用户中招的情况。
解决方法:
1.在js中使用innerHTML方法修改dom的时候,要对数据进行转义
2.对cookie设置httponly即只有后端可以获取cookie,前端无法读写,防范cookie被盗用。
6. 跨域问题
有没有遇到跨域问题,为什么会跨域,浏览器同源策略,解决方法:说了JSONP,JSONP能不能发Post请求,CORS,CORS怎么实现的跨域,CORS的兼容性,IE9+可用,说成IE10+可用...,除了这两种还有什么跨域方式,说了HTML5的postMessage,有没有用过,没有...,还有什么跨域解决方法,iframe解决跨域,修改domain实现跨域,iframe跨域能不能发起Post请求,答不可以,面试官继续引导,说可以,通过iframe+form实现跨域无刷新post请求。这个方法的应用场景是
需要做post跨域请求 => 想到form可以做跨域post请求 => form提交会导致页面刷新 => 把form提交到iframe就不会导致页面刷新 => 让这个iframe把form提交到后台 => iframe拿到数据后再返回给主页面
因为iframe被我们隐藏了,所以iframe的刷新我们看不到,以此实现post无刷新提交。
两个跨域问题就是post请求跨域(用form+iframe解决),主页面与iframe间的跨域(用修改domain解决)
iframe解决post跨域之前真的没做了解,跪了跪了。
7.有没有做过登录验证
这个被问到的时候不知道什么是登录验证,以为是cookie记住登录态这种问题,一番搜索才知道,面试官应该是想要我回答前后端分离如何做到登录验证,回答JWT(JSON Web Token)之类的登录验证。
传统的后端记住用户登录态是利用seesion保存用户信息,然后返回一个cookie,每次进入网页用cookie验证服务端是否有保存这个用户的session,这样每多一个用户就要增加一个session,服务端的开销会越来越大。
JWT是一种基于Token的登录验证方法,使用JWT,服务端不再需要保存session,只要对客服端返回的用户信息进行加密,再把经过加密的Token返回给客户端,客户端将Token保存在cookie(并设置httponly)或localStorage内,每次对后端做请求的时候都把Token放在请求头的Authorization
字段中,服务端收到这个字段,对Token进行解密,知道你是哪个用户后放回相应的请求内容。
大致流程如下:
8. 反向代理
反向代理也是前端的东西!?
一番搜索后发现其实也不难理解,但是面试时听到反向代理也只知道nginx是做反向代理的,往深了说并不了解...
说反向代理,先从用户使用代理服务器说起,代理服务器的作用即,当我想要访问某个网站的时候,出于不想让网站知道谁访问了它的目的,我先进过一个代理服务器,让代理服务器去访问这个网站,代理服务器再把网站的请求结果返回给我。
反向代理即不是用户设置代理服务器,而是服务端自己加了一层代理服务器,用户访问网站的时候,先不直接访问真实的服务器,先过代理服务器。
这样做的好处有3个:
- 安全过滤
先确认该用户是真实用户还是攻击,请求信息是否有危害网站的内容,没问题再转向真实服务器。
2.内容缓存
缓存服务器就相当于反向代理服务器的作用了,用户不用访问真实服务器就能拿到资源,减少真实服务器的负担。
3.负载均衡
当服务器有多台时,先经过反向代理服务器,让方向代理服务器判断当前哪台服务器空闲,就把请求转到哪台服务器,实现负载均衡。
大问题就问这么多,全程38分钟,说实话觉得所有问题都回答得很一般。考的知识点基本是JS,CSS之外的网络,或者实际工作中的一些策略性问题,这方面自己确实是很薄弱的,需要再深入研究。还是很开心能有这次的面试机会!
以上知识点复习参考了以下文章:
浏览器缓存知识小结及应用
跨站请求伪造-维基百科
XSS的原理分析与解剖
前端xss攻击
iframe跨域POST提交
iframe实现跨域post请求的技术细节
使用隐藏iframe进行表单跨域提交的方法封装
浅谈前端登录认证机制
前后端分离,前端如何判断登录状态?
基于 Token 的身份验证
适用于前后端分离的下一代认证机制 —— JSON Web Token(译) · Issue #1 · smilingsun/blog
什么是反向代理服务器 | 程序师
网友评论