WordPress 4.9.9でSVGがアップロードできない!原因と応急処置

Advertisement

このWordPressブログでSVG画像をアップロードしようと思ったら「セキュリティの理由によりこのファイル形式は許可されていません」とエラーが出てくるようになってしまいました。このブログでは「SVG Support 」というプラグインを入れて対応していたんですが、どうやらWordPress 4.9.9でプラグインが機能しなくなってしまったようです。

参考までに以前書いたSVGについての記事へのリンクです:

当面の対処法

当面は以下の2つの方法のどちらかで対処ができそうです。

1. プラグインを入れ替える

取り急ぎ、このブログでは「Safe SVG 」というプラグインに入れ替えて対処しました。こちらのプラグインは4.9.9でテストされていて、5.0.1にアップデートしたこのブログでも問題なく機能しました。

2. SVGファイルにXML宣言を追加する

SVGファイルをテキストエディタで開いてXML宣言が入っているか確認します。以下が入っていなかったら、SVGファイルの最初の行に追加します。

<?xml version="1.0" encoding="utf-8"?>

このブログで使っていたSupport SVGプラグインのSupportページ でプラグイン開発者の方がコメントをしてくれていました。開発者の方は対策を講じたいと言っているのですが、一人で開発しているプラグインで、しかも、彼が今週手術するとかで、すぐに対応するのは難しいとのことです。大変な時に調査してコメントまで残してくれて、ありがたいですね。しっかり療養して治してほしいです。

functions.phpにMIMEタイプを追加してもダメだした

ちなみに、functions.phpに以下のfilterを入れてもダメでした。ここは関係ないみたいですね(というか、プラグインでこの辺が対処されてるはず)。

// Add SVG support
function add_mime_types($mimes) {
  $mimes['svg'] = 'image/svg+xml';
  return $mimes;
}
add_filter('upload_mimes', 'add_mime_types');

原因

WordPress 5.0.1でアップロードされるファイルのMIMEの確認が強化されて、アップロードされるファイルの拡張子と内容がマッチしているか確認をするようになったとのことです。この辺が怪しそうですけど、SVGがアップロードできなくなったのは4.9.9なので、直接関係しているかはわかりません。(ひょんさんより「4.9.9も5.0.1と同じセキュリティアップデート」とのコメントをいただきました。4.9.9からSVGがアップロードできなくなったのは、MIMEの確認の強化が原因のようですね。)

アップロードファイルのMIMEの検証について

以下のページの「MIME validation for uploaded files」というセクションに該当する情報が書かれていました。

SVGファイルの検証について

また、コメント欄のconnoroharaさんのコメント に、SVGファイルの検証(Validation)について書かれていて、この辺が一番怪しそうです。

I do see a downside with SVG though. Most of the time, when an SVG is used, the <?xml?> tag is stripped. Adobe Illustrator does this by default when exporting to SVG. This leads to these SVG files to not pass validation.
Since SVG is becoming more and more popular nowadays (and for good reason!), I would say that an SVG should be validated in a different way, allowing SVG files with their <?xml?> stripped to pass validation, if possible.

以下、意訳です。

SVGについてはダウンサイドが考えられます。ほとんどの場合、SVGが使われる際には<?xml?>が削除されてしまいます。Adobe IllustoratorではSVGに書き出す際、デフォルトでそれが行われます。これが、それらのSVGファイルが検証を通らない原因になります。
SVGはますます人気が高まっているので(しかも良い理由で!)、可能であれば<?xml?>が削除されたSVGが検証を通るように、SVGは他の方法で検証されるべきだと思います。

僕がアップロードして失敗したSVGファイルは、確かに<?xml?>タグが入っていませんでした。Affinity Designerで「SVG(Web用)」として書き出したものです。ちなみに「SVG(書き出し用)」で書き出した場合、<?xml?>タグ(XML宣言)は残っていました。これだったらファイル検証をパスするのかな?

Safe SVGのSanitizationについて

これが原因だとすると、functions.phpfilterを追加してもダメだったのが納得です。だけど、Safe SVGプラグインではどうやって対処してるんだろう?

Safe SVGではSVGファイルのチェックにsvg-sanitizer というライブラリを使っていて、セキュリティの問題がないかチェックしているそうです。もしかして、このSanitization(消毒)の際に<?xml?>タグを挿入してるのかな?

プラグインのサポートページの情報

以下、参考までにSVG Supportプラグインのサポートページ に、2つのスレッドが立っていました。この辺を追っていったら、後日、もう少し詳しい原因と解決方法が見つかるかもしれません。

新たな情報が見つかったら、この記事に追加していきます。取り急ぎ、ご報告でした!

更新情報

  • 追加の情報が出てきたので、情報を追加して文章を整理しました(2018/12/17)

About the author

Rriverの竜(りょう)です。「明日のウェブ制作に役立つアイディア」をテーマにこのブログを書いています。アメリカの大学を卒業後、東海岸のボストン近郊でウェブ制作を開始。帰国後、東京のウェブ制作会社に勤務。現在は組織のウェブ担当者として日英バイリンガルウェブサイトの運営に携わっています。より詳しくはこちら

記事へのコメントはもちろん、執筆・翻訳、レスポンシブなウェブサイト制作、コラボのご相談などもTwitter @rriver またはFacebook でお気軽にご連絡ください。

“WordPress 4.9.9でSVGがアップロードできない!原因と応急処置” への2件のフィードバック

  1. ひょん より:

    4.9.9も5.0.1と同じセキュリティアップデートなので、ファイルチェックが強化されてるはずです。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です