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
})