Pytanie Zapobieganie zastrzykom HTML i skryptów w JavaScript


Załóżmy, że mam stronę z polem wprowadzania danych. Użytkownik wpisuje coś w polu wprowadzania i uderza w przycisk. Przycisk uruchamia funkcję, która podnosi wartość wpisaną w polu tekstowym i wyświetla ją na stronie pod polem tekstowym z dowolnego powodu.

Teraz jest to niepokojąco trudne do znalezienia ostatecznej odpowiedzi lub nie chciałbym pytać, ale w jaki sposób chciałbyś wypisać ten ciąg:

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

Tak więc ani skrypt nie jest wykonywany, ani element HTML nie jest wyświetlany?

Naprawdę pytam, czy istnieje standardowa metoda unikania zarówno wtrysku HTML, jak i wtrysku skryptu JavaScript. Każdy wydaje się mieć inny sposób robienia tego (używam jQuery, więc wiem, że mogę po prostu wypisać ciąg znaków do tekst element, a nie html element na przykład, nie o to chodzi).


31
2017-12-31 10:02


pochodzenie


możliwy duplikat Jak zapobiec atakom JavaScript injection w HTML generowanym przez użytkownika - JJJ
Czy chcesz zablokować wszystko Wstrzyknięcie HTML lub po prostu niebezpieczny te? - Barmar
Ponadto, jeśli przypadkiem użycia jest tak naprawdę to, co mówisz, a to jest tylko JavaScript po stronie klienta, naprawdę nie musisz zapobiegać "wstrzykiwaniu". Użytkownik może zaatakować samego siebie, jeśli dane wejście nie zostanie pokazane nikomu innemu (i jeśli zostanie pokazane innym użytkownikom, aby odseparować serwer wejściowy). - JJJ
Wszystko to dotyczy wyjaśnienia pojęcia i metod zapobiegania tego typu zjawiskom. A co stanowi niebezpieczny zastrzyk html w przeciwieństwie do bezpiecznego? - lorless
<h1>Hello World</h1> jest bezpiecznym zastrzykiem, ponieważ nie stanowi zagrożenia dla bezpieczeństwa użytkownika. Jeśli chcesz zapobiec iniekcji HTML / JS, usuń kodowanie tagów HTML. To proste. - JJJ


Odpowiedzi:


Możesz kodować < i > do ich odpowiedników w HTML.

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

Jak wyświetlić znaczniki HTML jako zwykły tekst


46
2017-12-31 10:28



As! Dokładnie to, czego szukałem, przepraszam, jeśli to było niejasne. To jest zatem wyrażenie regularne? Nie korzystałem z nich szczególnie poza niewielkimi modyfikacjami kodu innych osób. - lorless
To bardzo proste wyrażenie regularne - wyrażenie jest w zasadzie <. w javascriptu wyrażenie regularne jest definiowane wewnątrz ukośników (//) i g oznacza, że ​​powinien wyszukać wszystkie wystąpienia (g = global). - TastySpaceApple
@dlampard Pamiętaj, że to jest dokładnie to, co .text() robi, więc jeśli masz jQuery, nie ma potrzeby stosowania niestandardowego wyrażenia regularnego. - JJJ
Okay, staram się unikać używania jQuery, ponieważ zaciemnia to, co się dzieje, a ja próbuję zrozumieć pojęcia i podstawy. Ale to uwielbiam. - lorless
Masz pomysł, co zrobić, jeśli chcesz zezwolić na stosowanie tylko niektórych tagów, na przykład pogrubienia lub kursywy? - sab669


Oto mały skrypt, używając jQuery, który usuwa cały HTML i przechowuje tylko tekst:

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

Można to zrobić w czystym javascript (es6), jeśli włączenie jQuery jest problemem:

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

8
2017-12-31 10:14



zauważ, że zapytanie nie zawierało a jquery tag, więc powinieneś spróbować odpowiedzieć zwykłym javascript. - TastySpaceApple
Rozwiążę i udzielę odpowiedzi bez jquery, jeśli OP o to poprosi. Zasada byłaby taka sama tutaj. - BiAiB
Nie jestem do końca pewien, dlaczego, ale jeśli wartość html wynosi 0, wydaje się, że zwraca pusty ciąg znaków. - Rikaelus
Musisz przekazać mu ciąg, więc "0" pracowałbym. możesz sprawdzić źródło github.com/jquery/jquery/blob/2.2-stable/src/core/parseHTML.js i zobacz, jak odrzuca wejścia nieciągłe - BiAiB
Pytanie: Jesteś tego pewien? temp.innerHTML = arbitraryHtmlString; nie rozpocznie wstępnego ładowania obrazów i ich uruchamiania onload programy obsługi zdefiniowane w tagach graficznych i tym podobne? - Joe


Jeden liniowiec:

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

Zobacz, jak działa:

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


1
2018-02-20 01:49





Wypróbuj tę metodę, aby przekonwertować ciąg znaków, który może potencjalnie zawierać kod html na format tekstowy:

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

Mam nadzieję że to pomoże!


0
2017-08-13 23:20



Nie jest to metoda javascript i napisałeś kod PHP. - Soorajlal K G


Użyj tego,

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 , "" );
}

W backend, dla java, spróbuj użyć klasy StringUtils lub niestandardowego skryptu.

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
2017-07-12 11:42