2009-10-28 42 views
18

Estoy buscando un simple sanitizador HTML escrito en JavaScript. No es necesario que sea 100% seguro XSS.Sanitizer HTML simple en Javascript

Estoy implementando Markdown y el editor de WMD Markdown (rama SO master de github) en mi sitio web. El problema es que el HTML que se muestra en la vista previa en vivo no se filtra, como aquí en SO. Estoy buscando un sanitizador de HTML simple/rápido escrito en JavaScript para que pueda filtrar el contenido de la ventana de vista previa.

No es necesario un analizador completo con protección XSS completa. No estoy devolviendo la salida al servidor. Enviaré el Markdown al servidor donde utilizo un sanitizador completo de HTML antes de almacenar el resultado en la base de datos.

Google está siendo absolutamente inútil para mí. Acabo de recibir cientos de artículos (a menudo incorrectos) sobre cómo filtrar javascript del HTML generado por el usuario en todo tipo de idiomas del lado del servidor.

ACTUALIZACIÓN

voy a explicar un poco mejor por qué necesito esto. Mi sitio web tiene un editor muy similar al que está aquí en StackOverflow. Hay un área de texto para ingresar la sintaxis de MarkDown y una ventana de vista previa debajo que le muestra cómo se verá después de enviarla.

Cuando el usuario envía algo, se envía al servidor en formato MarkDown. El servidor lo convierte a HTML y luego ejecuta un desinfectante HTML sobre él para limpiar el HTML. MarkDown permite HTML arbitrario, así que necesito limpiarlo. Por ejemplo, el usuario escribe algo como esto:

<script>alert('Boo!');</script> 

convertidor La MarkDown no se toca, ya que es HTML. El desinfectante de HTML lo quitará para que el elemento del guión desaparezca.

Pero esto no es lo que sucede en la ventana de vista previa. La ventana de vista previa solo convierte MarkDown en HTML, pero no lo desinfecta. Por lo tanto, la ventana de vista previa tendrá un elemento script. Esto significa que la ventana de vista previa es diferente de la representación real en el servidor.

Quiero arreglar esto, así que necesito un sanitizador HTML de JavaScript rápido y sucio. Algo simple con elementos básicos/atributos de listas negras y listas blancas hará. No es necesario que sea seguro XSS porque la protección XSS se realiza mediante el desinfectante HTML del lado del servidor.

Esto es solo para asegurarse de que la ventana de vista previa coincidirá con la representación real el 99.99% del tiempo, lo cual es suficiente para mí.

¿Puede ayudarnos? ¡Gracias por adelantado!

+3

Fwiw, odio cuando la vista previa no coincide con lo que se publica. – Ms2ger

+1

@ ms2ger: Es por eso que necesito el desinfectante de HTML, para que la vista previa coincida con lo que hace el servidor en el back-end. –

+0

¿no es un problema permitir que los atacantes prueben sus ataques en su navegador mientras no vea ninguno de sus intentos? – siukurnin

Respuesta

9

Usted debe echar un vistazo a la recomendada en esta pregunta Sanitize/Rewrite HTML on the Client Side

Y sólo para estar seguro de que usted no necesita hacer más sobre XSS, revise las respuestas a ésta How to prevent Javascript injection attacks within user-generated HTML

+1

Caja parece útil, pero pesada. Tendré que probar si es lo suficientemente rápido. Aunque lo dudo. Estoy seguro de que estoy a salvo de XSS porque el HTML que estoy analizando nunca se envía al servidor. Estoy enviando el Markdown original. El HTML que necesito desinfectar es solo la vista previa y nadie, excepto el usuario que lo digita, lo verá alguna vez. –

-1

para mi función, solo me ha preocupado que la cadena no esté vacía y contenga solo caracteres alfanuméricos. Esto usa JS simple y ninguna tercera biblioteca ni nada. Contiene una expresión regular larga, pero cumple su función;) Puedes construir sobre esto pero haz que tu expresión regular sea algo más parecido 'script <> | </script> '(con caracteres escapados donde sea necesario y sin espacios).;)

var validateString = function(string) { 

     var validity = true; 

     if(string == '') { validity = false; } 

     if(string.match(/[ |<|,|>|\.|\?|\/|:|;|"|'|{|\[|}|\]|\||\\|~|`|!|@|#|\$|%|\^|&|\*|\(|\)|_|\-|\+|=]+/) != null) { 

      validity = false; 
     } 

     return validity; 
    } 
Cuestiones relacionadas