web-dev-qa-db-fra.com

Prévention des injections de HTML et de script en Javascript

Supposons que j'ai une page avec une zone de saisie. L'utilisateur tape quelque chose dans la zone de saisie et appuie sur un bouton. Le bouton déclenche une fonction qui prend la valeur saisie dans la zone de texte et la renvoie sur la page située sous la zone de texte pour une raison quelconque.

Maintenant, cela a été troublant de trouver une réponse définitive sinon je ne vous le demanderais pas, mais comment feriez-vous pour sortir cette chaîne: 

<script>alert("hello")</script> <h1> Hello World </h1>

Alors que ni le script n'est exécuté ni l'élément HTML n'est affiché? 

Ce que je demande vraiment, c’est de savoir s’il existe une méthode standard permettant d’éviter l’injection de HTML et de script dans Javascript . Tout le monde semble avoir une manière différente de le faire (j'utilise jQuery donc je sais que je peux simplement sortir la chaîne dans l'élément text plutôt que dans l'élément html par exemple, ce n'est pas le problème ).

javascripthtmljavascript-injectionhtml-injections
40
lorless

Vous pouvez coder les < et > en équivalents HTML.

html = html.replace(/</g, "&lt;").replace(/>/g, "&gt;");

Comment afficher les balises HTML sous forme de texte brut

50
TastySpaceApple

Voici un petit script, utilisant jQuery, qui supprime tout le code HTML et ne conserve que le texte:

function( html ) {
    return $( $.parseHTML(html) ).text();
}

Cela peut être fait en JavaScript pur (es6) si l'inclusion de jQuery pose problème:

function textFromHtmlString( arbitraryHtmlString ) {
    const temp = document.createElement('div');
    temp.innerHTML = arbitraryHtmlString;
    return temp.innerText;
}
8
BiAiB

Un one-liner:

var encodedMsg = $('<div />').text(message).html();

Voir le travail:

https://jsfiddle.net/TimothyKanski/wnt8o12j/

1
Timothy Kanski

J'utilise cette fonction htmlentities ($ string):

$msg = "<script>alert("hello")</script> <h1> Hello World </h1>"
$msg = htmlentities($msg);
echo $msg;
0
Tadas Janca

Utilisez ceci, 

function restrict(elem){
  var tf = _(elem);
  var rx = new RegExp;
  if(elem == "email"){
       rx = /[ '"]/gi;
  }else if(elem == "search" || elem == "comment"){
    rx = /[^a-z 0-9.,?]/gi;
  }else{
      rx =  /[^a-z0-9]/gi;
  }
  tf.value = tf.value.replace(rx , "" );
}

Sur le serveur, pour Java, essayez d’utiliser la classe StringUtils ou un script personnalisé. 

public static String HTMLEncode(String aTagFragment) {
        final StringBuffer result = new StringBuffer();
        final StringCharacterIterator iterator = new
                StringCharacterIterator(aTagFragment);
        char character = iterator.current();
        while (character != StringCharacterIterator.DONE )
        {
            if (character == '<')
                result.append("&lt;");
            else if (character == '>')
                result.append("&gt;");
            else if (character == '\"')
                result.append("&quot;");
            else if (character == '\'')
                result.append("&#039;");
            else if (character == '\\')
                result.append("&#092;");
            else if (character == '&')
                result.append("&amp;");
            else {
            //the char is not a special one
            //add it to the result as is
                result.append(character);
            }
            character = iterator.next();
        }
        return result.toString();
    }
0
Karthik SK

Essayez cette méthode pour convertir une 'chaîne pouvant potentiellement contenir du code html' en 'format de texte':

$msg = "<div></div>";
$safe_msg = htmlspecialchars($msg, ENT_QUOTES);
echo $safe_msg;

J'espère que cela t'aides!

0
Billy Bob