v-html 防止XSS注入


       v-html更新元素的innerHTML,內容按普通HTML插入,不會作為Vue模版進行編譯。在網站上動態渲染任意HTML是非常危險的,因為容易導致XSS攻擊,只在可信內容上使用v-html,永不用在用戶提交的內容上,

       在使用v-html時為了防止XSS攻擊,可以安裝 npm install xss 插件,但是我們在渲染富文本編輯的文章時,使用XSS會把除了標簽和內容之外的所有東西都給過濾掉,如calss,style過濾掉,那么樣式就展現不出來了,導致美觀度不夠

       解決辦法: 使用vue-dompurify-html插件(vue-dompurify-html是v-html的“安全”替代品)

1  // 安裝:
2          npm install vue-dompurify-html
3 
4  // 引入:
5          import VueDOMPurifyHTML from 'vue-dompurify-html'
6          Vue.use(VueDOMPurifyHTML)
7  // 使用:
8          <div v-dompurify-html="rawHtml"></div>

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM