vue项目:解决v-html可能带来的XSS是跨站脚本攻击

简介: vue项目:解决v-html可能带来的XSS是跨站脚本攻击

一、项目简介

vue开发,nuxt项目

二、问题简述

当使用v-html时,出现提示如图:

三、解决问题

3.1、方案

使用vue-dompurify-html代替v-html

3.2、安装

yarn add vue-dompurify-html

3.3、plugins下创建vueInject.js  (名字自己取)

import VueDOMPurifyHTML from 'vue-dompurify-html'
import Vue from 'vue'
Vue.use(VueDOMPurifyHTML)

 

3.4、nuxt.config.js

配置项 plugins

引入文件

3.5、重启项目

3.6、项目使用:

<div  v-dompurify-html="form.content"></div>

四、效果:

五、独学而无友,则孤陋而寡闻, 欢迎关注、收藏、评论、指正

六、参考链接:

nuxt中v-html指令警告(warning ‘v-html‘ directive can lead to XSS attack vue/no-v-html)_dan_seek的博客-CSDN博客

相关文章
|
17天前
|
SQL 安全 Java
java的SQL注入与XSS攻击
java的SQL注入与XSS攻击
33 2
|
18天前
|
前端开发 安全 JavaScript
XSS和CSRF攻击概览
【6月更文挑战第27天】**XSS和CSRF攻击概览** - XSS:利用未验证用户输入的Web应用,注入恶意脚本到浏览器,盗取信息或控制用户账户。防御措施包括输入验证、内容编码、HttpOnly Cookie和CSP。 - CSRF:攻击者诱使用户执行非授权操作,利用现有会话。防御涉及CSRF Tokens、双重验证、Referer检查和SameSite Cookie属性。 应用这些策略可提升Web安全,定期审计和测试同样重要。
23 3
|
24天前
|
前端开发
HTML+CSS练习小项目——百叶窗
HTML+CSS练习小项目——百叶窗
|
13天前
|
存储 JavaScript 网络安全
XSS 攻击是什么?如何防护?
XSS 攻击是什么?如何防护?
17 0
|
1月前
|
SQL 安全 Java
Spring Boot中的跨站点脚本攻击(XSS)与SQL注入防护
【6月更文挑战第15天】在现代Web应用程序开发中,安全性是一个至关重要的课题。跨站点脚本攻击(XSS)和SQL注入是最常见的两种攻击类型,它们可以严重威胁到应用程序的安全。
127 0
|
JavaScript Java 物联网
现有vue项目seo优化
现有vue项目seo优化
|
JavaScript 前端开发
重读vue电商网站45之项目优化上线
重读vue电商网站45之项目优化上线
108 0
重读vue电商网站45之项目优化上线
|
2天前
|
JavaScript
|
4天前
|
JavaScript
【vue】el-dialog 内的tinymce弹窗被遮挡的解决办法 及 tinymce打开弹出菜单后直接关闭对话组件,导致该弹出菜单残留
【vue】el-dialog 内的tinymce弹窗被遮挡的解决办法 及 tinymce打开弹出菜单后直接关闭对话组件,导致该弹出菜单残留
16 6
|
1天前
|
存储 缓存 JavaScript
vue代码优化方案
【7月更文挑战第13天】 **Vue.js 优化要点:** 分解大组件以提高复用性和加载速度;利用计算属性与侦听器优化数据处理;使用Object.freeze()减少响应式数据;借助Vuex或Composition API管理状态;实现虚拟滚动和无限加载提升长列表性能;路由懒加载减少初始加载时间;用Vue DevTools检测性能瓶颈;定期代码审查与重构;应用缓存策略;遵循最佳实践与团队规范,提升应用整体质量。
10 2