WordPressのデフォルト設定では、SVG（Scalable Vector Graphics）ファイルのアップロードが制限されています。しかし、SVGはロゴやアイコンなどのベクター画像として非常に便利なフォーマットです。今回は、WordPressでSVGをアップロードできるようにする方法と、セキュリティ対策について解説します。
なぜWordPressはSVGのアップロードを制限しているのか？
SVGはXMLベースのファイル形式であり、悪意のあるコード（JavaScriptなど）を埋め込むことが可能です。そのため、デフォルトではアップロードが禁止されています。
SVGをアップロードできるようにする方法
① functions.php にコードを追加する方法（簡易対応）
WordPressの functions.php に以下のコードを追加すると、SVGのアップロードが可能になります。
function allow_svg_upload($mimes) {
if (current_user_can('manage_options')) { // 管理者のみ許可
$mimes['svg'] = 'image/svg+xml';
}
return $mimes;
}
add_filter('upload_mimes', 'allow_svg_upload');
管理者のみがSVGをアップロードできるように制限しているので、基本的なセキュリティ対策も施されています。
② SVGをサニタイズ（安全化）する
SVGにはスクリプトやイベントハンドラ（onclick など）が含まれる可能性があるため、アップロード時に自動的に削除する処理を追加します。
function sanitize_svg($file) {
if ($file['type'] === 'image/svg+xml') {
$svg = file_get_contents($file['tmp_name']);
// 不要なスクリプトやイベントハンドラを削除
$svg = preg_replace('/<script.*?</script>/is', '', $svg);
$svg = preg_replace('/on\w+=\".*?\"/is', '', $svg);
$svg = preg_replace('/<\?xml.*?\?>/is', '', $svg);
$svg = preg_replace('/<!DOCTYPE.*?>/is', '', $svg);
// 上書き保存
file_put_contents($file['tmp_name'], $svg);
}
return $file;
}
add_filter('wp_handle_upload_prefilter', 'sanitize_svg');
スクリプトや不要な属性を自動削除し、SVGファイルを安全に保ちます。
③ 偽装されたファイルを防ぐ（MIMEタイプの検証）
SVGの拡張子を持ちながら、実際には異なるファイル形式である場合（例: .svg だが PHP ファイルを含む）をブロックするコードを追加します。
function validate_svg_mime_type($data, $file, $filename, $mimes) {
$filetype = wp_check_filetype($filename, $mimes);
if ($filetype['ext'] === 'svg' && $filetype['type'] !== 'image/svg+xml') {
return array('error' => '不正なSVGファイルのためアップロードできません。');
}
return $data;
}
add_filter('wp_check_filetype_and_ext', 'validate_svg_mime_type', 10, 4);
偽装ファイルを防ぎ、正しいMIMEタイプのSVGのみアップロードを許可します。
プラグインを使う方法（簡単＆安全）
プログラムを編集したくない場合は、プラグインを利用すると簡単に対応できます。
おすすめのプラグイン
- Safe SVG
- SVGファイルを自動でサニタイズし、セキュリティを強化
- メディアライブラリでプレビュー可能
- SVG Support
- SVGのアップロードを許可し、カスタムCSSクラスの追加が可能
プラグインを使用すれば、より簡単にSVGを扱えます。
まとめ
functions.php を編集して手動で対応する場合:
allow_svg_upload()でアップロードを許可sanitize_svg()で不正なコードを削除validate_svg_mime_type()でMIMEタイプを厳格チェック
プラグインで対応する場合:
Safe SVGかSVG Supportを利用
WordPressで安全にSVGを利用するためには、アップロード制限を解除するだけでなく、サニタイズや偽装ファイル対策を組み合わせることが重要です。ぜひ、この記事を参考にして、安全なSVG運用を行ってください。
コメント