Windows Azure の Web サイトで SVG を表示できなかった時の対処

ぺんぎんさん( @penguin2716 )がろまのふ魔法陣を公開されていました。

SVG で出力できないか聞いてみたところ

ということだったので公開された SVG を Leaflet の中心に表示させようとトライしました。
っても Leaflet の機能ではなく CSS で Object を中心に表示させただけなんですが。

で、記事の本題。

出力してもらった SVG を Azure Web サイトに配置して直リンクで表示を試みたところ、次のようなエラーが出て表示することができませんでした。

the resource you are looking for has been removed, had its name changed, or is temporarily unavailable.

白い背景にこのメッセージは絶望的ですが、メッセージをそのままコピペしてググったところ、 Azure Web サイトでは MIME タイプで SVG が定義されていないためではないかという推定になりました。

Windows Azure Web サイトに MIME タイプを追加するには、 Web サイトのルートディレクトリに web.config ファイルを配置し、設定を書き込めば OK 。
具体的には下記の内容を記録してアップロードしました。

<configuration>
   <system.webServer>
      <staticContent>
         <mimeMap fileExtension=".svg" mimeType="image/svg+xml" />
      </staticContent>
   </system.webServer>
</configuration>

これで無事 SVG を表示することができました。
SVG は標準では定義されていないもんなんですね…。