首先可以看一下xss前端安全系列（一）的定义和基本思路：如何防范XSS攻击？安装$npminstallxss配置文件//@/utils/xss.jconstxss=require('xss')constoptions={css:false,onTag(tag,html,options){if(tag==='iframe'){returnhtml.replace(/javascript:?/,'')}},//避免过滤掉页面样式onIgnoreTagAttr(tag,name,value,isWhiteAttr){//过滤掉标签上的事件if(/^[^on]/.test(name)){returnname+'="'+xss.escapeAttrValue(value)+'"'}},}constfilter=newxss.FilterXSS(options)exportdefaultfiltermountglobal//@/main.jsimportxssfrom'@/utils/xss'//...Vue.prototype.$xss=xss//全局挂是在loader中通过这个方法过滤全局的v-html返回数据模块预处理//vue.config.js//...module.exports={//...chainWebpack:config=>{//...//添加xss处理config.module.rule('vue').use('vue-loader').loader('vue-loader').tap(options=>{options.compilerOptions.directives={html(node,directiveMeta){constprops=node.props||(node.props=[])props.push({名称:'内部HTML',value:`$xss.process(_s(${directiveMeta.value}))`,})},}返回选项})},}在页面中提交表单时使用//@/views/demo/index.vue
