Jaki jest najlepszy sposób na obsługę generowanych przez użytkowników treści html, które będą wyświetlane publicznie?

Question

W mojej aplikacji internetowej zezwalam na publikowanie treści generowanych przez użytkowników w celu spożycia publicznego podobnego do Stackoverflow.

Jaka jest najlepsza praktyka w przekazywaniu tego?

Moje obecne kroki do obsługi treści tworzone przez użytkowników są:

1. używam MarkItUp aby umożliwić użytkownikom łatwy sposób formatowania ich html.

2. Po użytkownik złożył thier zmiany go uruchomić poprzez HTML Sanitizer(wskaż bottem) że używa białej liście podejście.

3. Jeśli proces dezynfekcji ma wartość , usuń wszelkie utworzone przez użytkownika treści I , nie zapisuj zawartości. I następnie Powróć tam zmodyfikowaną treść z ostrzeżeniem o błędzie , "Niektóre nielegalne znaczniki treści , gdzie wykryto i zostały usunięte dwukrotnie, a następnie spróbuj ponownie."

4. Jeśli zawartość przechodzi przez proces odkażania czysto, zapisać surowy treść html do bazy .

5. Podczas renderowania do klienta po prostu przekazać surowego html z db do strony.

Answer 1

To całkiem rozsądne podejście. W przypadku typowych aplikacji będzie to całkowicie wystarczające.

Najtrudniejszą częścią surowego kodu HTML zawierającego białe listy jest atrybut style i embed/object. Istnieją uzasadnione powody, dla których ktoś mógłby chcieć umieścić style CSS w niezaufanym bloku sformatowanego tekstu lub powiedzieć, że jest to osadzony film z YouTube. Ten problem pojawia się najczęściej w plikach danych. Nie można ufać dowolnemu blokowi tekstu zawartemu we wpisie kanału, ale nie chcemy go rozbierać, np. Podświetlając składnię CSS lub Flash Video, ponieważ zasadniczo zmieniłoby to treść i potencjalnie dezorientuje każdego, kto ją czyta. Ponieważ CSS może zawierać niebezpieczne rzeczy, takie jak zachowania w IE, może być konieczne przeanalizowanie CSS, jeśli zdecydujesz się zezwolić na zachowanie atrybutu style. A z embed/object możesz potrzebować białych nazw hostów.

Addenda:

W najgorszych scenariuszy, uciekając Kopiuj wszystko w zasięgu wzroku może prowadzić do bardzo słabej doświadczenia użytkownika. Znacznie lepiej jest użyć czegoś takiego jak jeden z parserów HTML5, aby przejść przez DOM z białą listą. Jest to znacznie bardziej elastyczne, jeśli chodzi o sposób prezentacji odkażonych wyników użytkownikom.Można nawet robić takie rzeczy jak:

<div class="sanitized"> 
    <div class="notice"> 
    This was sanitized for security reasons. 
    </div> 
    <div class="raw"><pre> 
    &lt;script&gt;alert("XSS!");&lt;/script&gt; 
    </pre></div> 
</div> 

Następnie ukryć .raw rzeczy z CSS i użyć jQuery powiązać obsługi kliknij na .sanitizeddiv który przełącza pomiędzy .raw i .notice:

CSS:

.raw { 
    display: none; 
} 

jQuery:

$('.sanitized').click(function() { 
    $(this).find('.notice').toggle(); 
    $(this).find('.sanitized').toggle(); 
}); 

Answer 2

Biała lista jest dobrym posunięciem. Każde rozwiązanie z czarnej listy jest skłonne przepuścić więcej, niż powinno, ponieważ po prostu nie możesz myśleć o wszystkim. Widziałem pewne problemy z używaniem czarnych list (na przykład The Code Project), a jeśli uda im się złapać wszystko, generalnie nadal powodują dodatkowe problemy, takie jak zastępowanie znaków w kodzie, aby nie można było go używać bez ręcznego przywracania go w pierwszej kolejności .

Najbezpieczniejszą metodą byłoby:

1. HTML zakodować cały tekst.

2. Dopasuj zestaw dozwolonych tagów i atrybutów i odkoduj te.

Używając wyrażenia regularnego, można nawet wymagać, aby każdy znacznik otwierający miał znacznik zamykający, dzięki czemu niezamknięty znacznik nie może zepsuć strony.

Powinieneś być w stanie zrobić to w około dziesięciu liniach kodu, więc kod, który łączysz, wydaje się zbyt skomplikowany.