VUE常用的MARKDOWN插件MAVON-EDITOR，如何避免XSS攻击？

Vue常用的markdown的插件有mavon-editor， 但是我们在安装的时候，往往会被告知该插件存在隐藏的XSS攻击危险。那么如何避免XSS攻击呢？

安装markdown：
npm install mavon-editor --save

接下来介绍一款XSS防范插件XSS，可以在npm仓库直接下载。
https://github.com/Kylelkh/js-xss

安装命令：npm install xss --save
在Vue页面引入xss
import xss from 'xss'

测试攻击的代码：
<p v-html="testHtml"></p>

export default {
data () {

return {
  testHtml: `<a onclick='alert("xss攻击啦@@")'>点击</a>`

}

防御demo：

<p v-html="$xss(testHtml)"></p>

import xss from 'xss'
export default {
data () {

return {
  testHtml: `<a onclick='alert("xss攻击啦@@")'>点击</a>`
}

}

Object.defineProperty(Vue.prototype, '$xss', {
value: xss
})

 

首次发布于http://www.zlxvip.cn/index.php/archives/6/