SyntaxHighlighter:「alexgorbatchev.com」と「agorbatchev.typepad.com」の関係

ソースコードをWebページ上できれいに表示してくれる「SyntaxHighlighter」の設置方法には次の２通りがあります。

1. SyntaxHighlighterのソースコードとスタイルシートを自分の所有するサーバにアップロードして、使用する場所から読み込む
2. SyntaxHighlighterの公式ホスティングサービスが提供しているファイルを、使用する場所から読み込む(*1)

私が利用している Blogger の場合、JavaScript ファイルや CSS ファイルをファイルとしてアップロードすることができないため、２．の公式ホスティングサービスが提供しているファイルを以下のように使用しています。

<!-- SyntaxHighlighter START -->
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shCore.css' rel='stylesheet' type='text/css'/>
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css' rel='stylesheet' type='text/css'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js' type='text/javascript'>
</script>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCSharp.js' type='text/javascript'>
</script>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCpp.js' type='text/javascript'>
</script>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCss.js' type='text/javascript'>
</script>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js' type='text/javascript'>
</script>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJava.js' type='text/javascript'>
</script>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPerl.js' type='text/javascript'>
</script>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPlain.js' type='text/javascript'>
</script>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushVb.js' type='text/javascript'>
</script>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js' type='text/javascript'>
</script>
<script language='javascript' type='text/javascript'>
  SyntaxHighlighter.config.bloggerMode = true;
  SyntaxHighlighter.all();
</script>
<!-- SyntaxHighlighter END -->

このページをウェブサイトの表示速度の解析ができる「CTmetrix」(*2)で表示すると以下のようになります。

CTmetrix : 「見出しに<>が入っているとその部分が表示されない不具合を修正 - 最適化済みサンプル配布 - Bloggerの記事に目次をJavaScriptで自動的に付与する」

上の図からわかるように、指定したとおり「alexgorbatchev.com」のファイルにアクセスしていますが、302 Found になっています。

302 Found はリクエストしたリソースが一時的に移動されているときに返されるコードです。(*3)

Location ヘッダ移動先の URL が示されているということなので、Locationヘッダを見てみると



Location

http://agorbatchev.typepad.com/pub/sh/3_0_83/scripts/shBrushVb.js

とあり、「agorbatchev.typepad.com」に転送されていることがわかります。

その後、「agorbatchev.typepad.com」のファイルが読み込まれていることがわかります。

その後「agorbatchev.typepad.com」のファイルが読み込まれている

まとめ

SyntaxHighlighterの公式ホスティングサービス「alexgorbatchev.com」へアクセスすると、「agorbatchev.typepad.com」へ転送され、そこから実際のファイルが読み込まれます。
（2014/4/25 現在）

現時点ではこのような動作ですが、今後変更されることはあるかもしれません。

参考文献

*1

SyntaxHighlighter Hosting

http://alexgorbatchev.com/SyntaxHighlighter/hosting.html

*2

GTmetrix

http://gtmetrix.com/

*3

HTTPステータスコード - Wikipedia

http://ja.wikipedia.org/wiki/HTTP%E3%82%B9%E3%83%86%E3%83%BC%E3%82%BF%E3%82%B9%E3%82%B3%E3%83%BC%E3%83%89


関連記事：
→ 謎：syntaxhighlighter を導入したページが読み込み中のまま止まる（現在は解消）