Gistにsvg画像を置いてアクセスする方法

svg画像を他のサイトからアクセス可能にするために適当な置き場所を探していたのですが、svgを扱えないサイトは少なくありません。gistに置いてアクセスできる方法を見つけたのでメモします。

gistに次の画像のようにsvg画像のコードをコピペ。名前に拡張子.svgを付けておきます。

gist-svg-1

"Raw"ボタンをクリックすると、コードのみのページが表示されるので、このページのURLをコピーします。

次に、https://rawgit.com を開きます。

gist-svg-2

左側のURL https://rawgit.com/ShingoFukuyama/8e136aa8fcde4e9e9cc6/raw/3f213e18d784c63bfd222d2f9dd517e4bd5d3e4a/iOS7IconShape.svg

このサイトはそのままのURLではアクセスできても、Content-Type headersが制限されているために、svgやjavascriptなどとブラウザに認識されないファイルを正常化してくれます(特定のブラウザでBookmarkletが認識されないといった場合にも効果的です)。

左側のURLを使うとsvg画像が表示できるようになります。右側は無保証でトラフィック、スロットル制限なし一度アクセスされるとそのキャッシュをずっと使い続けるようで、頻繁にアクセスされることが予想されない限りテスト用の左側を使うといいと思います。