Vue中是如何防護XSS（注入攻擊）的

XSS 簡單來講就是 非法腳本 存儲在了服務端，並輸出到了用戶客戶端，腳本執行後就會讀取cookie等隱私數據 併發送信息給攻擊者

模擬一段攻擊文本

let xssText = '<script> console.log( 'cookie數據爲',  document.cookie ) </script>'

若是將這段文本直接寫在html標籤裏面，那麼它會直接執行（如 innerHtml操做 ）

這個時候就是很是不安全的，那麼怎樣作才能避免這種現象發生呢？有兩種方法
1.innerText 方法
2.createTextNode 建立文本節點

vue中是如何操做的呢

咱們來看一段模板代碼

<template>
   <div>{{ xssText  }}<div>
</template>

這種操做有害嗎？no，徹底無害，我來分析一下

上面一段模板代碼生成的render函數相似於

createElement( 'div', {}, xxsText ) // 建立vnode

vue 在 patchVnode（ 虛擬dom 生成 真實dom ）有以下代碼 處理子節點

紅框部分意思是 若是 vnode 子節點爲 基本類型 如字符串，那麼該文本會經過createTextNode方法 生成 文本節點，而後插入父節點

因此 很明顯  xssText 被 createTextNode 處理成了純字符串了，變成無害的了，so easy