😄
前端学习
  • 👋Welcome
  • 📖前端基础
    • HTML
      • 基础知识
      • 进阶知识
      • HTML5
    • CSS
      • 基础知识
      • 进阶知识
      • CSS 专题
        • CSS 选择器
        • CSS 布局
        • CSS 动画
        • CSS 画图
        • 响应式方案
        • CSS BEM 规范
        • CSS 案例
    • JavaScript
      • 基础知识
      • 进阶知识
      • 常用内置对象
        • Array 对象
        • String 对象
        • Number 对象
        • Boolean 对象
        • Math 对象
        • Date 对象
        • RegExp 对象
        • Object 对象
      • JS 专题
        • 数据类型
        • 原型链/继承
        • 对象赋值与拷贝
        • this 的指向
        • 异步操作
        • 模块化
        • 设计模式
    • 浏览器
      • 浏览器模型
      • 事件
      • 位置属性
      • Web 缓存
      • 本地存储
    • 综合内容
      • 前端跨域
      • 登录鉴权
      • 文件上传与下载
  • 🏗️前端框架
    • Vue.js
      • 基础知识
      • Vue 组件通信
      • Vuex 使用指南
      • Vue 动画
      • 静态网站框架 VuePress
    • React.js
      • 基础知识
      • 组件通信
  • 📦计算机基础/后端
    • 图解计算机网络
    • HTTP/HTTPS
    • TCP/UDP
    • Node.js
    • MongoDB
  • 🛠️开发工具
    • 版本控制工具-Git
      • git submodule
    • 构建工具-Webpack
    • 错误监控工具-Sentry
    • 单元测试工具-Jest
    • 包管理工具-NPM
    • 代码编辑器-VSCode
  • 🤔专题内容
    • 前端工程化
    • 代码规范
      • JavaScript 代码规范
      • CSS 代码规范
      • Vue 代码规范
      • Git Commit 规范
      • 代码规范配置
    • 网络安全与防御
    • 性能优化
    • 算法编程
    • 数据可视化
  • 🧑‍💻 面试相关
    • 面试知识总结
    • 面试问题总结
    • 面试常见编程
    • 面试资源汇总
  • 🍭其他
    • 项目经验❗️
    • 踩坑指南❗️
      • JavaScript 踩坑指南
      • CSS 踩坑指南
      • Vue 踩坑指南
    • 学习资源
    • 综合收藏夹
由 GitBook 提供支持
在本页
  • 1. 概述
  • 1.1 攻击类别
  • 1.2 安全问题
  • 2. XSS 跨站脚本攻击
  • 2.1 攻击分类
  • 2.2 攻击危害
  • 2.3 防御方法
  • 3. CSRF 跨站请求伪造
  • 3.1 原理过程
  • 3.2 攻击危害
  • 3.3 防御方法
  • 4. 点击劫持
  • 4.1 防御方法
  • 5. 中间人攻击
  • 5.1 防御方法
  • 6. SQL 注入
  • 6.1 防御方法

这有帮助吗?

  1. 专题内容

网络安全与防御

上一页CSS 代码规范下一页性能优化

最后更新于4年前

这有帮助吗?

1. 概述

1.1 攻击类别

1.2 安全问题

  • 用户身份被盗用

  • 用户密码泄露

  • 用户资料被盗取

  • 网站数据库泄露

2. XSS 跨站脚本攻击

参考资料:

XSS ( Cross Site Scripting ) 是指恶意攻击者利用网站没有对用户提交数据进行转义处理或者过滤不足的缺点,进而添加一些代码,嵌入到web页面中去。使别的用户访问都会执行相应的嵌入代码。从而盗取用户资料、利用用户身份进行某种动作或者对访问者进行病毒侵害的一种攻击方式。

2.1 攻击分类

反射型XSS:经过后端,不经过数据库。发出请求时,XSS代码出现在URL中,作为输入提交到服务器端,服务器端解析后响应,XSS代码随响应内容一起传回给浏览器,最后浏览器解析执行XSS代码。

举例:一个链接,里面的query字段中包含一个script标签,这个标签的src就是恶意代码,用户点击了这个链接后会先向服务器发送请求,服务器返回时也携带了这个XSS代码,然后浏览器将查询的结果写入Html,这时恶意代码就被执行了。

存储型XSS:经过后端,经过数据库。区别于反射型XSS,提交的代码会存储在服务器端(数据库,内存,文件系统等),下次请求目标页面时不用再提交XSS代码,但是该存储的XSS代码会传回给浏览器,浏览器发现有XSS代码,就正常执行,出发了XSS攻击。

举例:攻击者在一篇文章的评论中写入了script标签,这个评论被保存数据库,当其他用户看到这篇文章时就会执行这个脚本。

DOM XSS:不经过后端,通过url传入参数去控制触发。DOM XSS的代码并不需要服务器参与,触发XSS靠的是浏览器端的DOM解析,完全是客户端的事情。

2.2 攻击危害

  • 获取页面数据

  • 获取cookie

  • 劫持前端逻辑

  • 发送请求

  • 偷取网站任意数据

  • 偷取用户资料

  • 偷取用户密码和登陆态

  • 欺骗用户

2.3 防御方法

  • cookie设置httpOnly属性

  • 对用户的输入进行检查

  • 进行特殊字符过滤(转义) - 建议使用成熟的转义库

3. CSRF 跨站请求伪造

3.1 原理过程

Web A 为存在 CSRF 漏洞的网站,Web B 为攻击者构建的恶意网站,User C 为 Web A 网站的合法用户。

  1. 用户 C 打开浏览器,访问受信任网站 A,输入用户名和密码请求登录网站 A

  2. 在用户信息通过验证后,网站 A 产生 Cookie 信息并返回给浏览器,此时用户登录网站 A 成功,可以正常发送请求到网站 A

  3. 用户未退出网站 A 之前,在同一浏览器中,打开一个 TAB 页访问网站 B

  4. 网站B接收到用户请求后,返回一些攻击性代码,并发出一个请求要求访问第三方站点 A

  5. 浏览器在接收到这些攻击性代码后,根据网站 B 的请求,在用户不知情的情况下携带 Cookie 信息,向网站 A 发出请求,网站 A 并不知道该请求其实是由 B 发起的,所以会根据用户 C 的 Cookie 信息以 C 的权限处理该请求,导致来自网站 B 的恶意代码被执行

3.2 攻击危害

  • 利用用户登录态

  • 用户不知情

  • 完成业务请求

  • 盗取用户资金

  • 冒充用户发帖背锅

  • 损坏网站名誉

3.3 防御方法

  • 验证 HTTP Referer 字段;

  • 在请求地址中添加 token 并验证;

  • 在 HTTP 头中自定义属性并验证;

  • 不让第三方网站访问到用户 Cookie等

  • cookie 设置 sameSite

sameSite 用来防止 CSRF 攻击和用户追踪,主要由三个值,其中 Strict 最为严格,完全禁止第三方 Cookie,跨站点时,任何情况下都不会发送 Cookie。换言之,只有当前网页的 URL 与请求目标一致,才会带上 Cookie。Lax 属性值稍稍放宽,大多数情况也是不发送第三方 Cookie,但是导航到目标网址的 Get 请求除外。

4. 点击劫持

点击劫持是一种视觉欺骗的攻击手段。攻击者将需要攻击的网站通过 iframe 嵌套的方式嵌入自己的网页中,并将 iframe 设置为透明,在页面中透出一个按钮诱导用户点击。

4.1 防御方法

X-FRAME-OPTIONS是一个 HTTP 响应头,在现代浏览器有一个很好的支持,主要就是为了防御用 iframe 嵌套的点击劫持攻击。该响应头有三个值可选,分别是

  • DENY,表示页面不允许通过iframe的方式展示

  • SAMEORIGIN,表示页面可以在相同域名下通过iframe的方式展示

  • ALLOW-FROM,表示页面可以在指定来源的iframe中展示

5. 中间人攻击

中间人攻击是攻击方同时与服务端和客户端建立起了连接,并让对方认为连接是安全的,但是实际上整个通信过程都被攻击者控制了。攻击者不仅能获得双方的通信信息,还能修改通信信息。通常来说不建议使用公共的 Wi-Fi,因为很可能就会发生中间人攻击的情况。

5.1 防御方法

增加一个安全通道来传输信息,HTTPS 就可以用来防御中间人攻击,但是并不是说使用了 HTTPS 就可以高枕无忧了,因为如果你没有完全关闭 HTTP 访问的话,攻击方可以通过某些方式将 HTTPS 降级为 HTTP 从而实现中间人攻击。

6. SQL 注入

所谓 SQL 注入,就是通过把 SQL 命令插入到 Web 表单提交或输入域名或页面请求的查询字符串,后台执行 SQL 语句时直接把前端传入的字段拿来做 SQL 查询。

6.1 防御方法

  • 永远不要信任用户的输入。

  • 永远不要使用动态拼装 sql

  • 不要把机密信息直接存放

参考资料:

如果你对内容有任何疑问,欢迎提交 或

🤔
前端安全系列之二:如何防止CSRF攻击?
❕issues
✉️ email
《前端安全系列(一):如何防止 XSS 攻击?》
XSS 跨站脚本攻击
CSRF 跨站请求伪造
点击劫持
中间人攻击
SQL 注入