javacriptを使用してクライアント側のユーザー入力をサニタイズする

Question

私は既にサーバ側でサニタイズを処理していますが、<script>alert('hi')</script>などの不適切な入力テキストは適切に処理できます。ユーザーが

<script>alert('hi')</script> 

を送信する場合しかし、私はまたのWebSocketを使用して、データの周囲を通過するので、この部分が壊れているので、私はencodeURIComponentで見つけたが、1つは、クライアント側でXSSの取り扱いのためにあるencodeURI、と混同？

Answer 1

XSSのサニタイズについては、Yahooのxss-filtersライブラリーまたはDOMPurifyをご覧ください。

ここDOMPurify使用例：

var input = document.getElementById('input'), 
 
    result = document.getElementById('result'), 
 
    button = document.getElementById('button').addEventListener('click', function(){ 
 
     // Sanitize 
 
     var clean = DOMPurify.sanitize(input.value, {SAFE_FOR_TEMPLATES: true}); 
 

 
     result.innerHTML = clean; 
 
     console.log(clean); 
 
    });

<script src="https://cdnjs.cloudflare.com/ajax/libs/dompurify/0.8.4/purify.min.js"></script> 
 

 
<input type="text" id="input"> 
 
<button id="button">Send</button> 
 
<p id="result"></p>