flawopen.com/JavaScriptのXSS/Svelte
SvelteはデフォルトでXSSを防げる？
`{comment}` は印刷されたメモのようなものです。山かっこも文字として表示されます。`{@html comment}` は、ページ上の記号を組版指示として扱うよう依頼することに似ています。信頼できない情報源の記号を渡すと、ブラウザーがHTMLとして解釈し、XSSにつながる可能性があります。
<p>{@html comment}</p>
// 値は実際のHTMLマークアップとして解釈される
<p>{comment}</p>
// 自動的にエスケープされる
基本ルール
Svelteは通常の {expression} 出力をエスケープ済みテキストとしてコンパイルするため、値がHTMLとして解釈されることはありません。一方、{@html} は意図的にHTML文字列を描画します。SvelteのドキュメントはXSS防止のため、値をエスケープするか信頼できる値だけを使うよう警告しています。このディレクティブを重要なHTML挿入箇所として扱い、ユーザー作成のリッチテキストには保守されているサニタイザーを使用してください。
コードベースの確認方法
`.svelte` ファイルで `{@html}` を検索します。各箇所について、値の出所とすべての変換を追跡してください。ユーザー入力、外部データ、保存されたユーザーコンテンツは信頼できないものとして扱います。テキスト表示なら `{expression}` を使います。リッチHTMLが必要な場合は、保守されているHTMLサニタイザーで処理し、許可されていないマークアップが除去されることをテストしてください。
grep -rn "{@html" --include="*.svelte" .リッチ HTML：サニタイズの境界を保つ
内容をテキストとして表示する場合は `{expression}` を使います。ユーザーが HTML を作成する必要がある場合は、保守されている HTML サニタイザー（DOMPurify など）で最終的な内容をサニタイズしてから `{@html}` に渡してください。サニタイズ後に文字列を連結したり変更したりすると、保護が無効になる可能性があります。サニタイザーを最新に保ち、製品に必要なマークアップ要素と属性だけを許可してください。HTML のサニタイズは、同じ値を JavaScript、CSS、URL のコンテキストで安全にするものではありません。