Today I learned

HTML Sanitizer API

Today I learned that there is a HTML Sanitizer API ↗.

It takes untrusted strings of HTML and sanitizes them to enable a safe insertion into the DOM.

This is pretty cool as sanitizing strings on the client side previously had to be done by using a third party module or writing your own functionality for that.

Every web developer should at least know a little bit about web-security. The term of XSS, also known as cross-site scripting ↗ is one of the most common security issues on the web.

This new Sanitizer API can deal with XSS without any extra configuration.

You just initialize a new Sanitizer object and pass it the untrusted HTML string.

const sanitizer = new Sanitizer()
const untrustedHTML = '<script>alert("XSS")</script>'
const sanitized = sanitizer.sanitizeFor('div', untrustedHTML)

It's important to add that this is still an experimental technology. Which means it's not available in most modern browsern. You have to set the experimental flag to true to use it.

But still it's great to see that standard browser APIs like this will become available in the future.

I hope you enjoyed this post and learned something new. If you have any questions, feel free to reach out to me on Twitter ↗ Opens in new tab or via Email ↗ Opens in new tab.

If you want to support me, you can buy me a coffee. I would be very happy about it!

I wish you a wonderful day! Marco