Best Practice: 3rd party HTML content and v-html

We have an XSS black list that we run on content created in our App before we save and display it with v-html

Which was great until we have to support 3rd party content, which may have any HTML in it and we can’t validate it until we display it.

What’s the best practice of pre-formatting/parsing/converting/stripping HTML at runtime to safe-HTML that won’t

  • break our layout (static widths and heights)
  • contain outside links in html (except for an <a href> that may be a part of the document)
  • anything malicious

Does anyone know of a plugin/mixin something along the lines of v-make-html-safe?

I think that will be hard. The HTML/CSS/JS you want to allow seems to be specific to your website, so you probably can’t find a solution that works out of the box. I wouldn’t be surprised if there exists libraries you can use to specify what parts of HTML/CSS/JS you want to to allow, but you probably need to write the list with the stuff you want to allow yourself, which probably won’t be easy.

How about just banning banning JS, allow all HTML and CSS and let users report to you whenever something don’t work, and you can go and fix that?