a-blog cms で ATNDモジュールを作ってみる その2(post_includeの活用)

a-blog cms には、Ajax を利用してページを表示後に、別のコンテンツを読み込む事ができる post include という機能が標準で実装されています。これを利用すると、その1 で問題になっていたキャッシュ部分が少し改善させる事が可能になります。

では、なぜ post include 機能を利用するとキャッシュの問題を少し改善する事ができるのでしょう?

  1. サーバ上に作成される各ページのキャッシュにはATNDモジュールは無い状態でキャッシュされる事になります。
  2. ATNDモジュール部分の小さなパーツは、単体でキャッシュされる事になります。

これであれば5000ページあったとしても、ATND API へのアクセスはキャッシュの有効期間に1回しかない事になります。あとはキャッシュの時間を5分にするのか、60分にするのかという運用をどうするのかを考える事になります。通常は長い時間キャッシュを有効にしておき、ルール等を利用して post include するテンプレートのキャッシュ時間を短めにする事も、どうにかする事ができるかもしれません。

以下に公式の post include のドキュメントをリンクしておきます。

a-blog cms のマニュアルに掲載されている post include 関連のエントリー

/include/atnd.html

その1のモジュール部分を別ファイルにします。

<!-- BEGIN_MODULE Api_Atnd_EventsUsers -->

<div style="margin-bottom:30px">
<h3><a href="{event_url}">{title}</a></h3>
<p>参加者:{accepted}人 / 定員:{limit}人</p>
<!-- BEGIN user:loop -->
<a href="http://twitter.com/#!/{twitter_id}" target="_blank"><img src="{twitter_img}" width="30" height="30" alt="{nickname}" /></a> 
<!-- END user:loop -->

<p><a href="{event_url}/entry/new">このイベントに参加登録する</a></p>
</div>
<!-- END_MODULE Api_Atnd_EventsUsers -->

上記を呼び出す側のテンプレートに記述する post include の設定

post include は form 部分を Ajax で結果と置き換える機能になりますので、呼び出す側は form タグになります。 また、post include には、submit を押した後に動作させる class="js-post_include" とページの表示が終わってから自動的に動作する class="js-post_include-ready" というのがあります。 今回は自動的に実行なので、以下のようになります。

<form action="" method="post" class="js-post_include-ready">
<input type="hidden" name="ACMS_POST_2GET" />
<input type="hidden" name="tpl" value="/include/atnd.html" />
</form>

また、ログインしている時には毎回APIにアクセスしてしまいますので、無事動作するようになった時点でタッチモジュールを利用して、ログイン時は上記のHTMLを表示しないようにした方がいいかと思います。

<!-- BEGIN_MODULE Touch_Unlogin -->
<form action="" method="post" class="js-post_include-ready">
<input type="hidden" name="ACMS_POST_2GET" />
<input type="hidden" name="tpl" value="/include/atnd.html" />
</form>
<!-- END_MODULE Touch_Unlogin -->

post include のデモ

試しにクリックしてみましょう!

関連エントリー

次回は管理ページでIDを設定できるようにする方法をご紹介します。


コメント

山本一道

山本 一道

有限会社アップルップル

名古屋のホームページ制作会社「有限会社アップルップル」の代表をしています。弊社で開発しているCMS「a-blog cms」や、名古屋の「WCAN」という名古屋のWeb制作者のためのセミナーの主催や、コワーキングスペース「ベースキャンプ名古屋」も始めました。

エントリーリスト

カテゴリーリスト

タグクラウド

実践! コンテンツファーストのWebサイト運用  a-blog cmsではじめるCMSプロトタイピング

2016年6月30日に株式会社ボーンデジタル様より「実践! コンテンツファーストのWebサイト運用 a-blog cmsではじめるCMSプロトタイピング」が発売されました。