Bereinigung dynamischer Rich-Text-Inhalte zur Verhinderung von Cross-Site-Scripting

import { ref, computed } from 'vue';
import DOMPurify from 'dompurify';
 
export function useSanitizedContent(rawHtmlInput) {
  const untrustedMarkup = ref(rawHtmlInput);
 
  const cleanHtml = computed(() => {
    return DOMPurify.sanitize(untrustedMarkup.value, {
      ALLOWED_TAGS: ['b', 'i', 'em', 'strong', 'a', 'p'],
      ALLOWED_ATTR: ['href', 'target', 'rel']
    });
  });
 
  return { untrustedMarkup, cleanHtml };
}