WordPressでSVG画像を安全にアップロードする方法と必須のセキュリティ対策

Webサイトのロゴやアイコン、イラストなどを表示する際、拡大しても画質が劣化せず、ファイルサイズも軽い「SVG（Scalable Vector Graphics）」は非常に便利な画像フォーマットです。

しかし、WordPressではデフォルト設定のままではSVGファイルをメディアライブラリにアップロードすることができません（「このファイルタイプはセキュリティ上の理由から許可されていません」というエラーが出ます）。

この記事では、なぜWordPressがSVGをブロックしているのかというセキュリティ上の理由と、それを踏まえた上で安全にSVGアップロードを有効化する方法（プラグイン・functions.php）を解説します。

なぜWordPressはデフォルトでSVGを禁止しているのか？
（セキュリティリスク）

最大の理由は、SVGが「画像」でありながら、その中身が「XML形式のコード（テキスト）」で構成されているからです。

一般的な画像（JPEGやPNG）はピクセルデータの集まりですが、SVGはコードであるため、内部にJavaScript（<script>タグ）を埋め込むことができてしまいます。

もし、悪意のあるJavaScriptが仕込まれたSVGファイルをWordPressにアップロードし、それをWebサイト上に表示（またはプレビュー）してしまうと、閲覧者のブラウザ上でそのスクリプトが実行されてしまいます。 これが**クロスサイトスクリプティング（XSS）**と呼ばれる深刻な脆弱性です。

• 想定される被害: ログインセッションの乗っ取り、サイトの改ざん、悪意のあるサイトへのリダイレクトなど。

このリスクを防ぐため、WordPressは標準でSVGのアップロードを遮断しています。

SVGを安全にアップロードする2つの方法

リスクを理解した上で、SVGを利用するための具体的な方法を2つ紹介します。

方法1：サニタイズ機能付きのプラグインを使用する（推奨）

最も手軽で安全なのが、アップロード時に危険なコードを自動で除去（サニタイズ）してくれるプラグインを使用することです。

• おすすめプラグイン：Safe SVG
  
  
  • 特徴: インストールして有効化するだけで、SVGのアップロードが可能になります。アップロード時にファイルの中身をスキャンし、悪意のある<script>タグなどを自動的に取り除いてくれるため、セキュリティ面でも安心です。

方法2：functions.php を編集して有効化する（開発者向け）

プラグインを増やしたくない場合や、自作テーマで制御したい場合は、テーマの functions.php にコードを追加して許可するMIMEタイプ（ファイル形式）を拡張します。

⚠️ 重要： 単にSVGを許可するだけではXSSのリスクが残るため、**「管理者権限（administrator）を持つユーザーのみアップロードを許可する」**という条件分岐を加えるのが実務上のベストプラクティスです。

PHP

/**
 * 管理者のみSVGファイルのアップロードを許可する
 */
function allow_svg_upload_for_admins( $mimes ) {
    // 現在のユーザーが管理者権限を持っているかチェック
    if ( current_user_can( 'administrator' ) ) {
        $mimes['svg'] = 'image/svg+xml';
    }
    return $mimes;
}
add_filter( 'upload_mimes', 'allow_svg_upload_for_admins' );

さらに高度なセキュリティ対策（サニタイズの実装）

上記のコードは「誰がアップロードできるか」を制限するものであり、ファイルそのものの無害化（サニタイズ）は行っていません。 もし自分以外のスタッフやクライアントがSVGをアップロードする環境であれば、PHPライブラリ（svg-sanitizer など）をComposer経由で組み込み、アップロード処理のフック（wp_handle_upload_prefilter）で中身を洗浄する処理を独自に実装する必要があります。

そこまでの工数をかけるのが難しい場合は、素直に「Safe SVG」プラグインを導入することをおすすめします。

まとめ

• SVGは中身がコード（XML）であるため、JavaScriptを埋め込まれるXSSのリスクがある。
• WordPressがデフォルトでアップロードを禁止しているのはこのため。
• 安全に利用するには、サニタイズ機能を持つプラグイン（Safe SVGなど）を使用するか、functions.php で管理者のみに権限を絞って許可する実装を行う。

SVGの特性とセキュリティリスクを正しく理解し、安全なWebサイト運用を心がけましょう。