前端知识体系之基础知识 - Web安全与防御

时间 2019-11-30

标签前端知识体系基础 web 安全防御栏目 HTML 繁體版

原文原文链接

1. SQL注入

1.1 介绍

例如作一个系统的登陆界面，输入用户名和密码，提交以后，后端直接拿到数据就拼接 SQL 语句去查询数据库。若是在输入时进行了恶意的 SQL 拼装，那么最后生成的 SQL 就会有问题。javascript

好比后端拼接的 SQL 字符串是：css

SELECT * FROM user WHERE username = 'user' AND password = 'pwd';
复制代码

若是不作任何防御，直接拼接前端的字符，就会出现问题。好比前端传来的 user 字段是以 '# 结尾，password 随意：html

SELECT * FROM user WHERE username = 'user'#'AND password = 'pwd'; 复制代码

密码验证部分直接被注释掉了。前端

1.2 防范

后端应该对于字符串有转义，能够借助成熟的库的 API 来拼接命令，而不是本身手动拼接。java

2. XSS: 跨站脚本攻击

2.1 介绍

原理上就是黑客经过某种方式（发布文章、发布评论等）将一段特定的 JS 代码隐蔽地输入进去。而后别人再看这篇文章或者评论时，以前注入的这段 JS 代码就执行了。JS 代码一旦执行，那可就不受控制了，由于它跟网页原有的 JS 有一样的权限，例如能够获取 server 端数据、能够获取 cookie 等。nginx

好比早些年社交网站常常爆出 XSS 蠕虫，经过发布的文章内插入 JS，用户访问了感染不安全 JS 注入的文章，会自动从新发布新的文章，这样的文章会经过推荐系统进入到每一个用户的文章列表面前，很快就会形成大规模的感染。git

2.2 防范

前端对用户输入内容进行验证，若是有风险，就进行替换。例如： & 替换为 &github

3. CSRF: 跨站请求伪造

3.1 介绍

CSRF 是借用了当前操做者的权限来偷偷地完成某个操做，而不是拿到用户的信息。好比获取 cookie、破解 token 加密等等。web

3.2 防范

敏感数据不使用 GET
先后端约定加密方式和密钥，而且常常更新密钥
对 IP 限制必定时间内的访问次数
设置网站白名单

4. 中间人攻击

4.1 原理和防范

它也被称为浏览器劫持、web 劫持。能够往 web 中添加一些第三方厂商的 dom 元素，或者重定向到另外的钓鱼站。sql

经常使用手段有 2 种：

网络报文传输过程当中对其截获、篡改（过程当中）
客户端发起 http 请求以前或者获得 response 以后对数据篡改（开头、结尾）

防范方式就是使用 https 协议，一套在传输层 TCP 和应用层 HTTP 之间的 TLS 协议。

4.2 Https交互细节

如下内容摘自：《深刻理解 Web 安全：中间人攻击》

简单地说，一次 https 网络请求在创建开始阶段具备如下的一个“握手”流程：

首先，客户端向服务端发起一个基于 https 协议的网络请求，这至关于告诉它：“我但愿获得一个安全加密的网页，你可别直接把明文扔过来！”

服务端接收到这个网络请求后，了解到客户端的提出的这种加密的诉求，因而先把一个公钥和网站的 https 证书发送给客户端。

客户端随后要作两件事，一是验证证书的合法性与时效性，若是颁发证书的机构客户端这边不认可或者证书中标明的过时时间已通过了，这都会致使客户端浏览器报出那个红叉子，chrome 浏览器还会直接拦截掉这个请求，除非用户点详情->继续，不然不会与该网站的服务器进行后续沟通，这至关于一个强交互的提醒，告诉用户“我拿到的证书有问题，这网站多是个冒牌货，你要看仔细了！”

若是以上两步验证无误，那么客户端会先生成一个随机秘钥，利用刚刚拿到的公钥给本身要访问的 url+这个随机秘钥进行加密，把密文再次发往服务端。

当服务端收到客户端传过来的密文以后，会经过本身手里持有的一个私钥对密文进行解密。注意，这里提到的私钥和刚刚的公钥是一对儿秘钥，这是一个典型的非对称加密，加密和解密分别使用两把不一样的钥匙，这也保证了在此场景下的安全性。

此时，服务端要将真正的 html 网页文本发给你了，它会利用解密获得的随机秘钥对网页文本内容进行加密，将密文发给客户端。

客户端拿到真正的 html 报文以后，就用本身刚才生成的那个随机秘钥进行解密，而后就获得了跟普通 http 请求时同样的一个网页文本了，在这以后就像往常那样解析、渲染、加载更多资源……

对于真正要传输的 html 文本，其实是使用刚刚提到的这个随机秘钥进行了一次对称加密，由于上锁和开锁的钥匙其实是如出一辙的。

5. DDos

攻击者在短期内发起大量请求，利用协议的缺点，耗尽服务器的资源，致使网站没法响应正常的访问。

防范的措施，或者称之为补救措施更合适，有如下建议：

借助云厂商 CDN：静态流量的资源还得本身掏钱
IP 黑/白名单：nginx 和 apache 均可以设置
HTTP 请求信息：根据 UserAgent 等字段的信息
静态化：博客网站直接挂在 github 等平台上
备份网站：阮一峰老师的网站被 ddos 的时候就有个备份页面
其余：弹性 ip、免费的 DNSpod、国内外分流、高防 ip 等等

6. 点击劫持

点击劫持是一种视觉欺骗的攻击手段。攻击者经过 iframe 嵌套嵌入被攻击网页，诱导用户点击。若是用户以前登录过被攻击网页，那么浏览器可能保存了信息，所以能够以用户的身份实现操做。

防范手段：

<head>
  <style id="click-jack"> html { display: none !important; } </style>
  <script> // 判断当前页面是不是iframe加载 if (self === top) { const style = document.getElementById("click-jack"); document.body.removeChild(style); } else { top.location = self.location; } </script>
</head>
复制代码

本文连接：xlogic.me/archive/201…