RSS経由でブログ記事を埋め込む際の反映タイムラグ対策
外部ブログ（Amebloなど）をホームページに埋め込むと、「記事を投稿したのに、すぐに反映されない…」ということがあります。
これはRSSのキャッシュが原因で、反映が数時間遅れることもあり、すぐに最新の記事をお届けしたい時には不便に感じられることがあります。
そこで今回は、なるべく早くブログ記事が反映されるように工夫した方法をご紹介します。
※アクセスが多いサイトの場合は、サーバーの負荷が高くなる可能性があります。そのため、すべてのサイトで必ずしも推奨できる方法ではありません。導入の際はご利用環境に応じてご判断ください。
1. サーバー側でRSSを処理する（PHP）
RSSをそのまま読み込むのではなく、まずはPHPでRSSを取得し、JSONに変換して返す「RSSプロキシ」を用意しました。
ポイントは、呼び出しURLにタイムスタンプをつけること。
これでキャッシュが使われにくくなり、更新が早く反映されます。
rss_proxy.php（ファイル名は任意で）
<?php
header('Content-Type: application/json; charset=utf-8');
header('Cache-Control: no-store, no-cache, must-revalidate');
header('Pragma: no-cache');
header('Expires: 0');
// RSS URL
$rss_url_base = "https://※ブログRSSのURL/rss.xml";
// キャッシュ設定（短時間キャッシュ）
$cache_file = __DIR__ . '/rss_cache.json';
$cache_time = 10; // 秒（アクセスごとに最大10秒はキャッシュを使う）
if(file_exists($cache_file) && (time() - filemtime($cache_file) < $cache_time)){
// キャッシュが有効なら読み込み
echo file_get_contents($cache_file);
exit;
}
// キャッシュがない、または古い場合はRSS取得
$rss_url = $rss_url_base . '?t=' . time(); // クエリ文字列でキャッシュ回避
$rss_content = file_get_contents($rss_url);
if (!$rss_content) {
echo json_encode(['error' => 'RSS取得失敗 しばらくしてから再度読み込んでください']);
exit;
}
// RSS解析
$xml = simplexml_load_string($rss_content, 'SimpleXMLElement', LIBXML_NOCDATA);
$items = [];
$days = ['日','月','火','水','木','金','土'];
foreach ($xml->channel->item as $item) {
$timestamp = strtotime((string)$item->pubDate);
$formatted_date = date('Y-m-d', $timestamp) . '（' . $days[date('w', $timestamp)] . '）';
$items[] = [
'title' => (string)$item->title,
'link' => (string)$item->link,
'pubDate' => $formatted_date,
'description' => (string)$item->description
];
}
// JSON化してキャッシュに保存
$json = json_encode(['items' => $items], JSON_UNESCAPED_UNICODE);
file_put_contents($cache_file, $json);
// 出力
echo $json;※サーバーの負荷を抑えたい場合は、
$cache_time = 10; // 秒
を60秒にするなど、更新頻度を下げることでアクセスのたびに処理が走るのを軽減できます。
（ただし、キャッシュ時間を長くしすぎると最新情報の反映が遅れるため、アクセス数や更新頻度に応じて、適切な値に設定するのがポイントです）
サーバーから返すデータに「キャッシュしないで」と伝える設定
先頭に以下のような記述を入れています。
これらは「HTTPヘッダー」と呼ばれるもので、サーバーからブラウザへ「このデータはこうやって扱ってください」と指示を出しています。
header('Content-Type: application/json; charset=utf-8');
header('Cache-Control: no-store, no-cache, must-revalidate');
header('Pragma: no-cache');
header('Expires: 0');
■Content-Type
返すデータの種類を指定しています。この場合は「JSON形式のデータですよ」とブラウザに伝えています。
■Cache-Control / Pragma / Expires
これらはキャッシュ（古いデータを一時的に保存して再利用する仕組み）に関する指示です。
- no-store → 保存しないでください
- no-cache → 必ずサーバーに最新データを取りに行ってください
- must-revalidate → キャッシュを使う場合も、必ず有効かどうか確認してください
- Expires: 0 → 有効期限を「もう切れている状態」にする（つまり常に新しいデータを要求する）
これらの設定を入れることで、ブラウザやサーバーが古いデータを勝手に残さず、常に最新の内容を優先して表示するようになります。
2. HTML/JavaScript側で表示をコントロール（記事埋め込み）
次に、jQueryを使ってプロキシから記事を取得します。
本文中の画像を取り出して並べたり、不要なタグを削除したりして、スッキリした形で記事を表示できるようにしました。
表示件数も自由に調整できるので、「最新1件だけ表示」や「最新5件まで表示」なども簡単に設定できます。
<div id="blog-feed"></div>
<script src="https://code.jquery.com/jquery-3.6.0.min.js">
まとめ
今回ご紹介した方法を使うと、ホームページに埋め込んだブログ記事の更新を、よりスムーズに反映させることができます。
主なポイントは次の通りです：
- RSSをPHPでJSON化 → JavaScriptで描画
記事の内容を一度サーバーで整理してから表示することで、更新が速く反映されます。 - タイムスタンプ付きURLでキャッシュを回避
古い情報が残りにくく、常に最新の内容を表示できます。 - 表示件数やレイアウトの自由度が向上
「最新1件だけ」「最新5件まで」など、表示件数の調整や整形も自由に行えます。 - スピーディーな情報提供が求められるサイトで有効
最新の情報を迅速に届けられるため、お知らせとして掲載したい場合にも有用です。また、訪問者に「常に更新されている」という印象を与えやすく、信頼感の向上にもつながります。
ホームページに埋め込むブログ記事は、訪問者に「更新されている」という印象を与える大切な要素です。
特に、お知らせとして掲載したい場合や、スピーディーな情報が求められるサイトでは、最新の情報をすぐに届けることが信頼感の向上にもつながります。
ブログの埋め込みが上手くいかない、反映されない等、お困りごとがございましたら弊社にお気軽にお問合せください。
