Bereinigen von Reaktiven Unsicheren HTML-Strings mit DOMPurify und Trusted Types

import { ref, computed } from 'vue';
import DOMPurify from 'dompurify';
 
const rawUserInput = ref('<img src=x onerror=alert(1)> Hello');
 
const sanitizedHtml = computed(() => {
  if (typeof window !== 'undefined' && window.trustedTypes) {
    const policy = window.trustedTypes.createPolicy('vueSanitizer', {
      createHTML: (string) => DOMPurify.sanitize(string, { RETURN_TRUSTED_TYPE: true })
    });
    return policy.createHTML(rawUserInput.value);
  }
  return DOMPurify.sanitize(rawUserInput.value);
});