¿Cómo prevenir ataques XSS cuando necesito renderizar HTML desde un editor WYSIWYG?

Question

Información de fondo no técnica: Estoy trabajando para una escuela y estamos construyendo un nuevo sitio web usando Django. Los profesores que trabajan para la escuela no son lo suficientemente competentes desde el punto de vista tecnológico como para utilizar otro lenguaje MarkUp como MarkDown. Finalmente decidimos que deberíamos usar un editor WYSIWYG, que presenta defectos de seguridad. No estamos demasiado preocupados por los propios maestros, sino por los estudiantes más maliciosos que puedan obtener las credenciales de los maestros.

Información técnica de fondo: Estamos utilizando Django 1.3 y aún no hemos elegido un editor específico. Nos inclinamos por uno de javascript como TINYMCE, pero podemos persuadirnos de utilizar cualquier cosa que permita la seguridad y la facilidad de uso. Debido a que el editor WYSIWYG generará HTML para representarse en el documento, no podemos simplemente escapar de él.

¿Cuál es la mejor manera de prevenir códigos maliciosos al mismo tiempo que facilita a los docentes no técnicos la tarea de escribir publicaciones?

Answer 1

Debe analizar el código HTML en el servidor y eliminar las etiquetas y los atributos que no cumplan con una lista blanca estricta.
Debe analizarlo (o al menos volver a representarlo) como XML estricto para evitar que los atacantes aprovechen las diferencias entre los analizadores difusos.

La lista blanca no debe incluir <script>, <style>, <link>, o <meta>, y no debe incluir los atributos o style="" controlador de eventos.

También debe analizar las direcciones URL en href="" y src="" y asegurarse de que son o rutas relativas, http://, o https://.

Answer 2

@SLaks tiene razón en que debe realizar la sanitización en el servidor, ya que los estudiantes que roban las credenciales de un maestro podrían usar esas credenciales para POSTAR directamente a su servidor.

Python HTML sanitizer/scrubber/filter analiza los desinfectantes HTML existentes disponibles para python.

Sugiero comenzar con una lista blanca vacía, luego usar el editor WYSIWYG para crear un fragmento de HTML usando cada botón para que conozca las variedades de HTML que produce, y luego incluir en la lista blanca solo las etiquetas/atributos necesarios para soportar el HTML que produce Esperemos que no use el atributo CSS style porque esos también pueden ser un vector XSS.

Answer 3

Esto es tarde, pero puedes probar Bleach, debajo del capó usa el html5lib, y también obtendrás el equilibrio de las etiquetas.

Aquí hay un fragmento completo:

settings.py

BLEACH_VALID_TAGS = ['p', 'b', 'i', 'strike', 'ul', 'li', 'ol', 'br', 
        'span', 'blockquote', 'hr', 'a', 'img'] 
BLEACH_VALID_ATTRS = { 
    'span': ['style', ], 
    'p': ['align', ], 
    'a': ['href', 'rel'], 
    'img': ['src', 'alt', 'style'], 
} 
BLEACH_VALID_STYLES = ['color', 'cursor', 'float', 'margin'] 

app/forms.py

import bleach 
from django.conf import settings 

class MyModelForm(forms.ModelForm): 
    myfield = forms.CharField(widget=MyWYSIWYGEditor) 


    class Meta: 
     model = MyModel 

    def clean_myfield(self): 
     myfield = self.cleaned_data.get('myfield', '') 
     cleaned_text = bleach.clean(myfield, settings.BLEACH_VALID_TAGS, settings.BLEACH_VALID_ATTRS, settings.BLEACH_VALID_STYLES) 
     return cleaned_text #sanitize html 

Puede leer el bleach docs, para que pueda adaptarlo a sus necesidades .