一个和v-html功能一样且能防止xss攻击的插件

时间:2024-10-26 16:08:51

一个和v-html功能一样且能防止xss攻击的插件

      • vue-dompurify-html 牛皮plus

在页面上显示富文本内容
在vue中可以用v-html来实现
但是v-html有一个弊端:无法防止xss攻击

现在和大家分享一个插件:
既能实现v-html的功能,又能防止xss攻击(也就是既要还要,嘻嘻嘻)

vue-dompurify-html 牛皮plus

 npm i vue-dompurify-html
// main.js
import VueDOMPurifyHTML from "vue-dompurify-html";
app.use(VueDOMPurifyHTML);
// *.vue
<template>
	<p v-dompurify-html='abc'></p>
</template>

<script setup>
import {  ref} from 'vue'

const abc = ref('<h1>你是你好的</h1><strong>发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题发送的问题</strong>')
</script>

结果就是这样
在这里插入图片描述
好了,随手记,一起学习吧