div contenteditable, XSS

Question

I currently have a simple <div contenteditable="true"> working, but, here's my problem.

Currently, the user can create a persistent XSS by inserting a <script> into the div, which I definitely do not want.

However, my current ideas to fix this are:

• Allow only a and img tags
• Use a textarea (not a good idea, because then have users copy and paste images)

What do you guys suggest?

Answer 1

You have to keep in mind that to prevent xss, you've GOT TO DO IT ON THE SERVER SIDE. If your rich text editor (ex YUI or tinyMCE) has some javascript to prevent a script tag from being inputted, that doesn't stop me from inspecting your http post requests, looking at the variable names you're using, and then using firefox poster to send whatever string I like to your server to bypass all client side validation. If you aren't validating user input SERVER SIDE then you're doing almost nothing productive to protect from XSS.

Any client side xss protection would have to do with how you render user input; not how you receive it. So, for example, if you encoded all input so it does not render as html. This goes away from what you want to accomplish though (just anchor and img tags). Just keep in mind the more you allow to be rendered the more possible vulnerabilities you expose.

That being said the bulk of your protection should come from the server side and there are a lot of XSS filters out there depending on what you're writing with (ex, asp.net or tomcat/derby/jboss) that you can look into.

I think you're on the right path by allowing ONLY a and img tags. The one thing you have to keep in mind is that you can put javascript commands into the src attributes of a tags, so take care to validate the href attributes. But the basic idea of "allow nothing and then change the filters to only allow certain things" (AKA whitelist filtering) is better than "allow everything and then filter out what I don't want" (AKA blacklist filtering).

In the comments below, Brian Nickel also said this which illustrates the point:

Everything but the elements and attributes you want to keep. I know you mentioned it in your answer but that bears repeating since it is so scary. <img onerror="stealMoney()">

The other thing you're going to want to do is define a XSSFilterRequest object (or something along those lines) and in a filter, override your requests so that any call to whatever your "getUrlParameter" and "getRequestParameter" objects run the request values through your xss filter. This provides a clean way to filter everything without rewriting existing code.

EDIT: A python example of xss filtering:

Python HTML sanitizer / scrubber / filter

Python library for XSS filtering?