面试:彻底理解Cookie以及Cookie安全

Cookie是什么

Cookie是服务端发送到用户浏览器并且保存到本地的一小块数据,它会在浏览器下次向同一服务器发起请求时,被携带到服务器上。

它的作用:

  • 经常用来做一些用户会话状态管理、个性化设置等等。

  • 前端可以通过document.cookie来访问cookie。

  • cookie是跨域的,也就是在不同的域名中,访问的cookie的时候,只能访问对应的域名的cookie。

关于cookie,前端面试中,问的东西比较多,总结了一下,会有这么一些问题。

Cookie 和 CSRF 的关系是什么

搞明白这个问题,首先要明白什么CSRF?和它相关的Cookie特性是什么?

1、CSRF是什么?

CSRF,中文名叫跨站请求伪造,发生的场景就是,用户登陆了a网站,然后跳转到b网站,b网站直接发送一个a网站的请求,进行一些危险操作,就发生了CSRF攻击!

这时候,懂得这个CSRF了吗?我认为一部分同学依然不懂,因为我看过太多这样的描述了!

因为有这么一些疑惑,为什么在b网站可以仿造a网站的请求?Cookie不是跨域的吗?什么条件下,什么场景下,会发生这样的事情?

这时候,我们要注意上面我对cookie的定义,在发送一个http请求的时候,携带的cookie是这个http请求域的地址的cookie。也就是我在b网站,发送a网站的一个请求,携带的是a网站域名下的cookie!很多同学的误解,就是觉得cookie是跨域的,b网站发送任何一个请求,我只能携带b网站域名下的cookie。

当然,我们在b网站下,读取cookie的时候,只能读取b网站域名下的cookie,这是cookie的跨域限制。所以要记住,不要把http请求携带的cookie,和当前域名的访问权限的cookie混淆在一起。

还要理解一个点:CSRF攻击,仅仅是利用了http携带cookie的特性进行攻击的,但是攻击站点还是无法得到被攻击站点的cookie。这个和XSS不同,XSS是直接通过拿到Cookie等信息进行攻击的。

2、Cookie相关特性?

在CSRF攻击中,就Cookie相关的特性:

1、http请求,会自动携带Cookie。

2、携带的cookie,还是http请求所在域名的cookie。

3、Cookie如何应对的 CSRF攻击?

明白了CSRF的本质,就能理解如何防御CSRF的攻击。

方案一:放弃Cookie、使用Token!

由于CSRF是通过Cookie伪造请求的方式,欺骗服务器,来达到自己的目的。那么我们采取的策略就是,不使用Cookie的方式来验证用户身份,我们使用Token!

Token的策略,一般就是登陆的时候,服务端在response中,返回一个token字段,然后以后所有的通信,前端就把这个token添加到http请求的头部。

这是当前,最常用的防御CSRF攻击的策略。

方案二:SameSite Cookies

前端在发展,Cookie也在进化,Cookie有一个新的属性——SateSite。能够解决CSRF攻击的问题。

它表示,只能当前域名的网站发出的http请求,携带这个Cookie。

当然,由于这是新的cookie属性,在兼容性上肯定会有问题。

方案三:服务端Referer验证

我们发送的http请求中,header中会带有Referer字段,这个字段代表的是当前域的域名,服务端可以通过这个字段来判断,是不是“真正”的用户请求。

也就是说,如果b网站伪造a网站的请求,Referer字段还是表明,这个请求是b网站的。也就能辨认这个请求的真伪了。

不过,目前这种方案,使用的人比较少。可能存在的问题就是,如果连Referer字段都能伪造,怎么办?

Cookie 和 XSS 的关系是什么

同样的道理,理清楚这两者的关系,先要搞明白什么是XSS攻击。

1、XSS是什么

XSS是由于不安全的数据引起的,有可能是表单提交的数据,有可能是页面路径的参数问题。

CSRF是通过伪造http请求,来达到自己的攻击目的。但是XSS是通过盗取用户的敏感信息而达到攻击的目的。比如本地存储、用户密码、cookie等等。

比如这个不安全的数据,是一个script标签,那这个script就可以链接任意的js文件,浏览器本地就会执行这个js,那通过js我们能做的东西就太多了:

比如document.cookie,获取用户信息。

比如通过localStorage,获取本地存储的敏感信息(token)。

然后只要是这个页面展示的任何信息,我都可以获取。

2、Cookie 如何应对 XSS攻击

方案一:http-only

Cookie有一个http-only属性,表示只能被http请求携带。

假如你的网站遭受到XSS攻击,攻击者就无法通过document.cookie得到你的cookie信息。

方案二:正则校验

我们了解到,XSS是由于不安全的数据引起的,这些数据的来源,一个重要的渠道就是提交表单,注入到数据库。所以针对前端,我们需要把表单数据进行正则验证,通过验证之后,才能提交数据。

对于服务端,也应该对接受的数据,进行规则校验,不符合规则的数据不应该入库。从接口层面,保证数据安全。

方案三:数据转义

如果无法保证数据库的数据都是安全的,前端能做的事情就是,把所有需要展示到页面的数据,进行转义,比如遇到script标签,直接replace处理。或者遇到标签标识‘<’以及‘>’这类特殊字符,添加‘\’进行处理。

Cookie 和 Token 对比

1、cookie可以引起csrf攻击,token在保持用户会话的时候好一点。

2、由于http请求携带cookie,当cookie过大的时候,会增大http请求的带宽。

3、cookie的特性,导致了cookie面对CSRF攻击的时候,很不安全。

Cookie如何做优化

从安全方面,尽量的使用token,进行会话保持。

从http请求的角度,尽可能让cookie的信息少一点,从而使得http请求的体积更小。

由于cookie的一个常用的作用,是保持用户会话的,所以仅仅在接口请求的时候,使用cookie。

加载其他资源,比如图片、js、css文件等等,可以托管到CDN上,这样就不会携带cookie,CDN的策略也使得资源加载更快。

原文链接:juejin.im

上一篇:前端快速建⽴Mock App
下一篇:vue前端展示markdown文件

相关推荐

  • 🔥前端面试大厂手写源码系列(上)

    如今前端攻城狮的要求越来越高,会使用常见的API已经不能满足现如今前端日益快速发展的脚步。现在大厂基本都会要求面试者手写前端常见API的原理,以此来证明你对该知识点的理解程度。

    2 个月前
  • 🔥《吊打面试官》系列 Node.js 必知必会必问!

    (/public/upload/f204a3b224d986128f1b4d9b8d06cd17) 前言 codeing 应当是一生的事业,而不仅仅是 30 岁的青春🍚 本文已收录 Git...

    2 个月前
  • (立下flag)每日10道前端面试题-15 关于【高级技巧】十问

    (/public/upload/4dc64bf14f4bd714fcd87e98b6a10373) 第一问:安全类型检测——typeof和instanceof 区别以及缺陷,以及解决方案 这两...

    1 个月前
  • 高级前端面试题大汇总(只有试题,没有答案)

    面试题来源于网络,看一下高级前端的面试题,可以知道自己和高级前端的差距。有些面试题会重复。 ...

    2 年前
  • 面试高频JS考查点手写实现

    原文链接 考查 this call、apply bind new 链式调用 考查原型链 instanceof 组合寄生继承 Object.create ...

    2 个月前
  • 面试题|手写JSON解析器

    这周的 Cassidoo 的每周简讯有这么一个面试题:: 写一个函数,这个函数接收一个正确的 JSON 字符串并将其转化为一个对象(或字典,映射等,这取决于你选择的语言)。

    3 个月前
  • 面试题:没有es6老项目,如何用jq解决异步的问题?

    我们都知道es6提供了promise异步写法,但是大部分的公司都是jq写的,那我们如何用Jq来写和promise异步一样的写法呢?这个知道的人不多下面我们就来写写把 注意: 1 JQ 1.5以上 ...

    2 年前
  • 面试题:nginx有配置过吗?反向代理知道吗?

    这篇文章主要是针对跨域进行配置,如果大佬们会配置的话,就不用看了~简述反向代理和正向代理反向代理: 我们将请求发送到服务器,然后服务器对我们的请求进行转发,我们只需要和代理服务器进行通信就好,偷个图:...

    1 个月前
  • 面试题:Hooks 与 React 生命周期的关系

    React 生命周期很多人都了解,但通常我们所了解的都是 单个组件 的生命周期,但针对 Hooks 组件、多个关联组件(父子组件和兄弟组件) 的生命周期又是怎么样的喃?你有思考和了解过吗,接下来我们将...

    10 个月前
  • 面试题(前端-字节跳动)

    只是做个记录 第一题 我叫王大锤,是一家出版社的编辑。我负责校对投稿来的英文稿件,这份工作非常烦人,因为每天都要去修正无数的拼写错误。但是,优秀的人总能在平凡的工作中发现真理。

    9 个月前

官方社区

扫码加入 JavaScript 社区