Markdownをプレビュー

どのMarkdownか、そしてHTMLをサニタイズする理由

Markdownは1つの仕様ではなく方言の集まりで、ここで使っているのは広く合意されているGitHub Flavored Markdownです。見出し、強調、リスト、リンク、画像、引用、表、シンタックスハイライト付きのコードブロック、タスクリスト、取り消し線、脚注、自動リンクに対応しています。ほとんどの人が書くのはこれで、READMEに含まれるのもこれです。より特殊な方言や、特定のサイトが追加する独自プラグイン（注記ブロック、ショートコード、テンプレート構文など）には対応していないため、特定のジェネレーター向けに書かれた文書では、一部の構文がそのまま文字として表示されることがあります。

HTMLは表示されますが、先にサニタイズされます。ここが理解しておくべき部分です。 Markdownは意図的にHTMLの埋め込みを認めているため、どこから来たMarkdownファイルにも、scriptタグ、インラインのイベントハンドラー、iframe、javascript: リンクが含まれている可能性があります。それをそのまま表示すると、見るためにREADMEを貼り付けただけで、見知らぬ人のコードがあなたのセッションで実行されてしまいます。表示の前に実行可能なものはすべて取り除かれるので、書式は残り、コードは残りません。

これはこのページの細部ではなく、一般的な教訓です。ユーザーが入力したMarkdownを表示するシステム（コメント欄、Wiki、サポートチケットなど）は、サニタイズしない限り、ユーザーが入力したHTMLを表示していることになります。「ただのMarkdownだから」という思い込みが、見落としの原因です。Markdownの変換はセキュリティの境界ではなく、境界になるのはサニタイズの工程です。

表示されるのは 内容 のプレビューで、特定のサイトでの見た目ではありません。GitHub、GitLab、ドキュメントジェネレーターはそれぞれ独自のスタイルシート、見出しアンカー、拡張機能を適用するので、同じファイルでも見た目は異なります。ここで表示される構造は、そのすべてに共通する部分です。外部から何も取得しないため、Webアドレスで指定された画像はそのサーバーが許可している場合にのみ読み込まれ、リポジトリ内のファイルへの相対パスはまったく解決できません。

ほかの目的には

実際に書いているREADMEなら、公開先でプレビューしてください。GitHub自身のエディタは、正確な表示、拡張機能、アンカーでプレビューできます。GitHub CLI の gh markdown-preview なら、同じレンダラーでローカルにプレビューできます。ドキュメントなら、ジェネレーター自体（MkDocs、Docusaurus、Hugo）に、実際のスタイルとナビゲーションを表示する自動再読み込み付きのプレビューがあり、それが読者の目にするものです。

確認ではなく編集が目的なら、ライブプレビュー付きのMarkdownエディタ（Obsidian、Typora、プレビュー機能を内蔵した VS Code）のほうが、毎回ページに貼り付けるより便利です。入力に合わせてプレビューが更新され、ファイルも元の場所に置いたままにできます。このページは、他人のMarkdownを読んだり、送られてきたものをさっと確認したりするためのものです。