XSS Prevention in {#html}
Understand the risks of {@html} and how to sanitize untrusted HTML.
XSS Prevention in {#html} is a free Sveltejs Academy lesson on CoddyKit — lesson 2 of 4. You can read the complete lesson below for free — then practise it hands-on in the browser with a built-in code editor and a 24/7 AI tutor. It is part of the Sveltejs Academy learning path, one of 4 lessons in the course, and your progress syncs across the web and the CoddyKit app.
What XSS Is
Cross-Site Scripting injects malicious scripts into pages, often via untrusted user input.
Default Safety
Svelte escapes interpolated text by default. {user.name} is safe.
{@html} Risk
The {@html ...} tag injects raw HTML. Never pass untrusted data through it.
Sanitize First
Use libraries like DOMPurify to clean HTML before injecting.
import DOMPurify from "isomorphic-dompurify";
const safe = DOMPurify.sanitize(userMarkdown);
<div>{@html safe}</div>Server-Side Sanitization
Sanitize on the server when storing, not just when rendering, to defend against future bugs.
Allow Lists
Configure DOMPurify to allow only specific tags and attributes (e.g. no <script>).
Markdown Pipelines
For user markdown, render to HTML then sanitize before output.
Trusted Sources
HTML from your CMS or static content is generally safe; user-submitted content is not.
CSP Headers
Set a Content Security Policy to limit damage if XSS slips through.
Inline Scripts
Disallow inline scripts in CSP to prevent injected scripts from running.
Audit Often
Review every {@html} usage; treat it as a security-critical operation.
Quick Check
What is the main risk of {@html}?
Recap
Avoid {@html} with untrusted data. Sanitize with DOMPurify and enforce strict CSP for defense in depth.
Frequently asked questions
Is the “XSS Prevention in {#html}” lesson free?
Yes — the full text of “XSS Prevention in {#html}” is free to read here on the web, and the Sveltejs Academy course includes 4 lessons in total. To practise it interactively (a built-in code editor and a 24/7 AI tutor) and unlock the rest of the Sveltejs Academy course, upgrade to CoddyKit PRO.
What will I learn in “XSS Prevention in {#html}”?
Understand the risks of {@html} and how to sanitize untrusted HTML. You practise Sveltejs Academy with hands-on code you run directly in the browser, and a 24/7 AI tutor answers your questions as you work through the lesson.
Do I need any experience to start Sveltejs Academy?
No prior experience is required. Sveltejs Academy on CoddyKit is structured for beginners through advanced learners; this is — lesson 2 of 4, so you can start here or from the beginning and move at your own pace.
How long does the “XSS Prevention in {#html}” lesson take?
Most CoddyKit lessons take about 5–10 minutes. Each one is bite-sized and interactive, so you make steady progress and pick up exactly where you left off across the web and the app.
Can I write and run code in this Sveltejs Academy lesson?
Yes. Every Sveltejs Academy lesson includes a built-in code editor, so you write and run real code right in your browser and get instant AI feedback — no local setup required.