3

I am using the DOMParser in my code as such:

 html`${this.domParser.parseFromString(this.richText, 'text/html').body.children}`

After reading the documentation i became a bit worried that Cross site Scripting attacks were still possible because as the documentation states:

You can perform the opposite operation—converting a DOM tree into XML or HTML source—using the XMLSerializer interface.

However it also states that it returns

Either Document or XMLDocument depending on the mimeType argument.

So is using this method going good for securing your site against XSS?

customcommander
  • 17,580
  • 5
  • 58
  • 84
Marc Rasmussen
  • 19,771
  • 79
  • 203
  • 364
  • 1
    What is `html` doing? Are you appending the result of this parsed document into the main document? If so, DOMParser doesn't offer any protection against XSS. – Kaiido Nov 15 '20 at 11:30

2 Answers2

8

In this introductory article on we can see that DOMParser#parseFromString is a known XSS sink.

The <script> blocks won't execute but the parser is unable to tell what constitutes an XSS threat.

You cannot use it to safely inject html into a page:

const parser = new DOMParser();
const html = '<img onerror="alert(`gotcha`)" src="">';
const new_node = parser.parseFromString(html, 'text/html').body.firstChild;
document.querySelector('div').appendChild(new_node);
<div></div>

How to sanitize HTML?

You can use a purpose-built library such as :

const dirty = '<img onerror="alert(`gotcha`)" src="">';
const clean = DOMPurify.sanitize(dirty);

console.log(clean);
<script src="https://unpkg.com/dompurify@2.2.2/dist/purify.min.js"></script>
customcommander
  • 17,580
  • 5
  • 58
  • 84
  • Thank you for your answer how should i go about avoiding XSS then? – Marc Rasmussen Nov 15 '20 at 19:42
  • 3
    DOMParser is safe as long as you keep away the untrusted nodes from the window DOM (use it purely for data processing). In fact, DOMPurify uses DOMParser under the hood to help process unsafe html. (Make no mistake, do not use DOMParser to sanitize html, and again, do not consider its result as a trusted html you could add to the main document) – Maciej Krawczyk Aug 14 '21 at 09:29
  • Relevant context: https://github.com/GoogleChrome/web.dev/issues/6890#issuecomment-979148946 – Thomas Orlita Mar 14 '22 at 09:11
7

DOMParser created documents are created with scripting disabled; the script is parsed, but not run, so it should be safe against XSS. That said, if you're doing this server-side and serving the result to a client, the client won't know about the "noscript" context, so it could be a source of vulnerabilities in the right context.

ShadowRanger
  • 143,180
  • 12
  • 188
  • 271
  • Thank you for your answer can you elaborate on the "Right Context" with an example? :) – Marc Rasmussen Nov 11 '20 at 08:34
  • 2
    @MarcRasmussen: [The other answer](https://stackoverflow.com/a/64843648/364696) gives an example where you use the resulting parsed HTML to inject parsed HTML into the page which invokes programmatic behavior. – ShadowRanger Nov 15 '20 at 16:18