文章写于 2016 年，旧的博客不维护了，一些文章直接迁移到这边来。本文为当时记录的第三篇，记得应该是腾讯音乐的内推一面/二面。后面内推挂了，走的实习招聘。
前端跨域
- 讲jsonp的原理, 如何实现
- jsonp的安全性: 当时自己说的是可不可以判断来源,比如请求头,域名.然后面试官说jsonp是get请求,没有origin的.我又猜测用reffer? 嗯,这个对了; 我还猜测是不是用cookie和session.但是直接的script请求是不能带上这个的. 面试官让我再想,我就猜可不可以传多一个验证的字段验证身份.对了.后面自己看书发现了这种方法就是token.记录如下:
先介绍CSRF: 跨站请求伪造，cross site requrest forgery.
意思是跨域发出请求，请求是身份认证后的（除了referer不一样，cookie是一样的） 原理: 受害者必须依次完成两个步骤： 1.登录受信任网站A，并在本地生成Cookie。 2.在不登出A的情况下，访问危险网站B。 cookie发送:如果是内存cookie,都可以正常发送,如果是本地cookie,需要带有p3p属性. get请求可以通过img等标签,post请求直接通过form表单提交.CSRF攻击是源于WEB的隐式身份验证机制！WEB的身份验证机制虽然可以保证一个请求是来自于某个用户的浏览器，但却无法保证该请求是用户批准发送的！
防御：
- Cookie Hashing, 所有表单中包含同一个伪随机值,表单提交的时候提交这个cookie(加密后)进行验证
- 用验证码,能完全解决,但是用户体验不好
- One-Time Token, 不同的表单包含一个不同的伪随机值.
- 服务端给一个token,token可能包含时间戳,用户名id,随机字符串
- 限制Session Cookie的生命周期
- 检查Referer
- 对于jsonp,过滤callback函数名,按照 JSON 格式标准输出 Content-Type 及编码（ Content-Type : application/json; charset=utf-8 ）。
参考:
跨域有没有额外的请求? 当时说没有=.= 后来想到又OPTIONS,自己确实遇到过的.
OPTIONS的用途:- 获取服务器支持的HTTP请求方法；也是黑客经常使用的方法。
- 用来检查服务器的性能。例如：AJAX进行跨域请求时的预检，需要向另外一个域名的资源发送一个HTTP OPTIONS请求头，用以判断实际发送的请求是否安全。
跨域的话,有没有遇到传cookie的问题?没有=.= 怎么解决? 查了一下资料,大概是这几种:
- 在后端提供一个获取其他域名下的所有cookie的接口,前端拿到cookie直接设置/或者后台返回设置cookie的js代码,前端jsonp加载
- 通过script发起一个请求,请求一个后端接口,发送一个加密的key,服务端验证key的合法性,在接口返回中写入登陆成功的cookie
- sohu的解决方法: 在登陆域名passport.sohu.com下登陆,通过隐藏的iframe提交登陆,返回内容写入成功登陆的cookie,此时cookie只有passport,然后前端通过登陆成功的标志操作iframe请求,带上cookie.后端检查到成功登陆的cookie后返回一段发起多个登陆请求的html片段; 这段html会请求一个加密后的17173的登陆url,这个链接就包含2中讲的key了,后面就和2一样. 在IE中,需要在响应内容的头部加入P3P.
其实当时如果不太紧张应该是可以想出来的=.= 当时说自己没遇到不会.
参考:移动端相关
- tap的实现原理,解决什么问题(300ms是系统为了检测是不是双击)
- 一个元素保留了tap事件和click事件,怎么阻止click事件的触发 参考StackOverlow:
$('elementsSetThatCanBeTapped').on('tap', function(e) { e.preventDefault(); e.stopPropagation(); $(this).off('click');})复制代码 看起来是解除了click事件,阻止默认行为和冒泡.我试试看..嗯试了一下真的可以.但是如果可以,不要绑定click事件就好了吧…上面差不多就是这么做了.不过如果有事件委托那不太一样.果然面试的时候脑子不顶用啊哈哈.
- 阻止事件冒泡/默认事件怎么做
XSS
问我还有没有了解其他前端安全.说了XSS.Cross Site Scripting.跨站脚本.然而重点不在跨站上.
发生在目标网站中目标用户的浏览器层面上,当用户浏览器渲染整个HTML文档的过程中出现了不被预期的脚本指令并执行时,XSS发生了. 跨站是因为一般攻击都是获取第三方的脚本资源(script请求).分为三种:反射型,存储型,DOMXSS- 反射型: XSS代码在url中作为输入提交到服务端,服务端解析后响应并在响应内容中出现这段xss代码,浏览器执行.(get,跳转)
- 存储型: XSS代码存在服务端,比如留言板
- DOMXSS: 通过各种输入点/输出点进行攻击(输入:document.cookie/location/url),(输出:docuemnt.write/window.open…)
防御措施:
不要在页面中插入任何不可信数据，除非这些数已经进行了编码 在将不可信数据插入到HTML标签之间时，对这些数据进行HTML Entity编码.编码的有6个: (当时蒙对了4个=.=)
& --> &< --> <> --> >" --> "' --> '/ --> /复制代码
不推荐将单引号( ‘ )编码为 ' 因为它并不是标准的HTML标签 需要对斜杠号( / )编码，因为在进行XSS攻击时，斜杠号对于关闭当前HTML标签非常有用
- 在将不可信数据插入到HTML属性里时，对这些数据进行HTML属性编码 属性一定用引号,属性里的引号就进行编码
- 在将不可信数据插入到SCRIPT里时，对这些数据进行SCRIPT编码
- 在将不可信数据插入到Style属性里时，对这些数据进行CSS编码
- 在将不可信数据插入到HTML URL里时，对这些数据进行URL编码
参考: