Javascript XSS-Verhinderung

Question

Es gibt ein Node.js-Projekt, das Daten bereinigt, und eine OWASP-Bibliothek für JavaScript, die eine Bereinigung vornimmt, um XSS zu verhindern.

Ich habe Benchmarking diese Bibliotheken, und sie sind ziemlich intensiv und vielleicht ein Overkill, meine Anwendung braucht keine dynamischen HTML (von Benutzern, bbtags oder was auch immer, überhaupt nicht erforderlich), also warum nicht tun es wie diese:

1. Deaktivieren " < " und " > "Wenn der Benutzer diese Zeichen eingibt, geben Sie ihm eine Warnung, dass diese Zeichen deaktiviert sind (Client- und Server-seitige Validierung).
2. & => &
3. " => "
4. ' => '
5. / => /
6. Verschlüsselung der übermittelten URLs (GET-Parameter usw.)
7. DOM-basiertes XSS ist abgedeckt, da meine Anwendung HTML5 PushState verwendet und das Backend vollständig vom Frontend getrennt ist.

Würde dies ausreichen, um mich zu schützen? Wie gesagt, meine Anwendung erfordert keine von den Benutzern übermittelten HTML-Daten, daher brauche ich die < y > Tags überhaupt nicht.

Vielen Dank für die Rückmeldungen, das ist das, was ich im Moment verwende:

var pattern = /<(.*)>/;

function hasHtmlTags(string) {
    return pattern.test(string);
};

if (hasHtmlTags(userData)) {
    // Do something?
} else {
    // Create entity.
}

Die Benutzer können also weiterhin ihre Emoticons :< und so weiter verwenden, und die Funktion wird nur ausgelöst, wenn eine Kombination aus < und > gefunden wird. Also keine teuren regulären Ausdrücke und dergleichen, sondern einfach < und > in Kombination deaktivieren, und alles sollte gut sein.

Answer 1

Hier ist ein allgemeines Kodierungsverfahren:

var lt = /</g, 
    gt = />/g, 
    ap = /'/g, 
    ic = /"/g;
value = value.toString().replace(lt, "&lt;").replace(gt, "&gt;").replace(ap, "&#39;").replace(ic, "&#34;");

Wenn Ihr Benutzer nichts an Ihren Server sendet, brauchen Sie die obigen Angaben nicht einmal. Wenn der Benutzer etwas eingibt und Sie die Benutzereingabe verwenden, sollte das obige sicher sein. Solange die Zeichen "<" und ">" global bereinigt sind und die Klammern ebenfalls bereinigt sind, ist alles in Ordnung.

Answer 2

Warum nicht encodeURIComponent bevor die Daten an den Kunden gesendet werden?

var string="<script>...</script>";
string=encodeURIComponent(string); // %3Cscript%3E...%3C/script%3

Answer 3

Unter Berücksichtigung von https://cheatsheetseries.owasp.org/cheatsheets/Cross_Site_Scripting_Prevention_Cheat_Sheet.html

Hier ist eine Umsetzung ihrer Empfehlungen:

function escapeOutput(toOutput){
    return toOutput.replace(/\&/g, '&')
        .replace(/\</g, '&lt;')
        .replace(/\>/g, '&gt;')
        .replace(/\"/g, '&quot;')
        .replace(/\'/g, '&#x27;')
        .replace(/\//g, '&#x2F;');
}

Achten Sie auch darauf, dass Sie diese Funktion nur dann verwenden, wenn es notwendig ist, sonst könnten Sie etwas kaputt machen.

Aber ich schlage vor, dass Sie einen Blick auf bereits erstellte Bibliotheken werfen, um die Ausgabe zu säubern:

https://github.com/ecto/bleach

Answer 4

Sie können eine Funktion verwenden wie

 function htmlEncode(str){
  return String(str).replace(/[^\w. ]/gi, function(c){
     return '&#'+c.charCodeAt(0)+';';
  });
}

Sie würden diese Funktion dann wie folgt verwenden:

<script>document.body.innerHTML = htmlEncode(untrustedValue)</script>

Wenn Ihre Eingabe innerhalb einer JavaScript-Zeichenkette erfolgt, benötigen Sie einen Encoder, der Unicode-Escaping durchführt. Hier ist ein Beispiel für einen Unicode-Encoder:

function jsEscape(str){
  return String(str).replace(/[^\w. ]/gi, function(c){
     return '\\u'+('0000'+c.charCodeAt(0).toString(16)).slice(-4);
  });

}

Sie würden diese Funktion dann wie folgt verwenden:

<script>document.write('<script>x="'+jsEscape(untrustedValue)+'";<\/script>')</script> 

Mehr Informationen: https://portswigger.net/web-security/cross-site-scripting/preventing