無料CDN「CloudFlare」で、Flickrのファイルもキャッシュする方法

投稿日: 2012/01/24 作成者: Makoto
この記事を読むのに必要な時間：約 2分51秒 URL短縮

楽しいみんなの写真　-とにかく撮る、flickrで見る。ソーシャルメディア時代の写真の撮り方・楽しみ方

本ブログの写真は、全て Flickr – Photo Sharing に格納されている。よって、サーバは、基本アメリカ。これだと、CloudFlare | The web performance & security company のイメージキャッシュが使えない。そこで、PHPの知識を駆使して、Flickr の写真を CloudFlare でキャッシュさせる方法を説明します。

まず、うちのブログは、無料で CloudFlare を使いたい&SSLも利用したいので、SSLありのWordPressだけど高速化したいからCloudFlareのCDNを無料で使う | 高橋文樹.com を参考に、http://s.makoto.forzamilan.jp/ をキャッシュする設定にしています。細かい方法は、上記のブログを参照してね。

で、次に HTTPd(Apache等)でアクセス出来る場所に、以下の様なファイルを作る。(自分の場合は、http://s.makoto.forzamilan.jp/img/flickr.jpg です)
※この場合、拡張子を jpg にする事が重要! flickr.jpg とか。でも、内容はPHPファイルです。

<?php
header('Content-type: image/jpeg');
$photo = $_REQUEST["r"];
readfile($photo);
?>

そして、そのディレクトリ(この場合は、専用のディレクトリを作ることを、お勧めします)に、.htaccess を設定します。

AddType application/x-httpd-php .jpg

その後、CloudFlare 経由でアクセスさせるために、テーマのfunctions.php に以下の様にプログラムを書きます。

/**
 * imgのURLを書き換える
 * @param string $tag
 * @return string
 */
function change_any_texts($text){
    $replace = array(
        //'変更前' => '変更後'
        'src="' => 'src="http://s.makoto.forzamilan.jp/img/flickr.jpg?r=',
    );
    $text = str_replace(array_keys($replace), $replace, $text);
    return $text;
}
add_filter('the_content', 'change_any_texts');

これで、イメージタグのsrcを、CloudFlare 経由で読み込むように設定します。