阅读 69

v-html可能导致的问题

v-html可能导致的问题

Vue中的v-html指令用以更新元素的innerHTML,其内容按普通HTML插入,不会作为Vue模板进行编译,如果试图使用v-html组合模板,可以重新考虑是否通过使用组件来替代。

描述

易导致XSS攻击

v-html指令最终调用的是innerHTML方法将指令的value插入到对应的元素里,这就是容易造成xss攻击漏洞的原因了。Vue在官网对于此也给出了温馨提示,在网站上动态渲染任意HTML是非常危险的,因为容易导致XSS攻击,只在可信内容上使用v-html,永不用在用户提交的内容上。
关于XSS,跨站脚本攻击XSS,是最普遍的Web应用安全漏洞。这类漏洞能够使得攻击者嵌入恶意脚本代码到正常用户会访问到的页面中,当正常用户访问该页面时,则可导致嵌入的恶意脚本代码的执行,从而达到恶意攻击用户的目的。当动态页面中插入的内容含有这些特殊字符如<时,用户浏览器会将其误认为是插入了HTML标签,当这些HTML标签引入了一段JavaScript脚本时,这些脚本程序就将会在用户浏览器中执行。当这些特殊字符不能被动态页面检查或检查出现失误时,就将会产生XSS漏洞。

  • 反射型XSS: 攻击者事先制作好攻击链接,需要欺骗用户自己去点击链接才能触发XSS代码,所谓反射型XSS就是将恶意用户输入的js脚本,反射到浏览器执行。
  • 存储型XSS:代码是存储在服务器中的,如在个人信息或发表文章等地方,加入代码,如果没有过滤或过滤不严,那么这些代码将储存到服务器中,每当有用户访问该页面的时候都会触发代码执行,这种XSS非常危险,容易造成蠕虫,大量盗窃cookie,也被称为持久型XSS
  • DOMXSS:类似于反射型XSS,但这种XSS攻击的实现是通过对DOM树的修改而实现的。
// 直接将输入打印到页面,造成XSS // 反射型示例

http://127.0.0.1/xss.php?i=

不作为模板编译

v-html更新的是直接使用元素的innerHTML方法,内容按普通HTML插入,不会作为Vue模板进行编译,如果试图使用v-html组合模板,可以重新考虑是否通过使用组件来替代。另外后端返回