Sugar Web Cloud

a-blog cms の処理順序とエスケープ

a-blog cms のテンプレートは全て上から処理が流れて行くのだと思ってハマってしまった事がありました。なので今回は a-blog cms のモジュールやブロックの処理順について書いていきたいと思います。

全体の処理順序

まずはグローバル変数なども含めた処理順序を見ていきましょう。a-blog cms のデベロッパーサイトにまとめてあったのでそちらを引用します。

テンプレートエンジンの実行順序は以下のようになります。

1. グローバル変数を解決
2. インクルード処理を解決
3. setTemplateを処理（テンプレートの変数化）
4. getTemplateを解決（変数の挿入）
5. タッチモジュールを解決（デフォルトON）
6. モジュール類を内側から解決（同じ階層の場合は下から）
7. IFブロックを解決
8. setRenderedを処理（解決済テンプレートを変数化）
9. getRenderedを解決（変数の挿入）

引用元サイト：実行順序 | a-blog cms developer

このように並べて見ると a-blog cms 独特の仕様が見えてきますね。特にここで注目して欲しいのは、「6. モジュール類を内側から解決」です。私はここではまりました...。

モジュールの入れ子

モジュールが入れ子になっている場合、上から順にモジュールを処理していくのではなく、中のモジュールから先に処理されます。しかし、外側のモジュールで算出される変数を内側のモジュールで使用したい場合もあると思います。そんな時には “エスケープ” という方法があります。

エスケープ

エスケープについても a-blog cms のデベロッパーサイトに詳しく載っていますのでそちらから引用します。

モジュールや変数、ブロックはエスケープする事ができます。 a-blog cms での エスケープとは、モジュールや変数、ブロックを一時的に動かないようにして、処理を遅らせる事を指します。 ここでいう処理を遅らせる単位とはモジュール一回分になります。（モジュールの入れ子一回分）

引用元サイト：エスケープ | a-blog cms developer
参考サイト：a-blog cms テンプレート解体新書 | a-blog cms | Web雑記帳

エスケープする事で、処理を送らせて後回しにする事が出来るみたいですね。ただし、エスケープ処理の記述方法が「モジュール/ブロック」と、「変数」で異なるのでその違いについてソースコードをみながら解説していきます。

変数表

ちなみに、ブロックは <!-- BEGIN ブロック名 --> <!-- END ブロック名 --> の事で、変数は {変数名} のような使い方をするもののことをいいます。

モジュール/ブロックの場合

「モジュール/ブロック」の場合は、開始終了宣言の直後にバックスラッシュを配置します。

<!-- BEGIN_MODULE\ Entry_Summary -->
  <!-- BEGIN\ entry:loop -->
  処理
  <!-- END\ entry:loop -->
<!-- END_MODULE\ Entry_Summary -->

変数の場合

「変数」の場合は、中括弧の始まり( { ) と、閉じる( } ) 直前に配置します。

\{title\}

「モジュール/ブロック」のエスケープには1箇所バックスラッシュを入れればいいですが、「変数」は2箇所必要になってくるので注意したいですね。

エスケープするためのバックスラッシュの入れ方について解説しました。次は、エスケープした時の処理の違いについて触れていきたいと思います。

「モジュール」と「ブロック/変数」の違い

エスケープする事で、処理を後回しにする事が出来るのはもう理解できたかと思います。
しかし、「モジュール」と「ブロック/変数」で処理のされ方が異なってきます！モジュールを3重以上入れ子にする場合はこの「モジュール」と「ブロック/変数」の違いを把握しておかないと意図通りの処理になってくれない場合があるので注意してください。

今回は下の簡易的なソースコードを例に、モジュールと変数の違いについて説明します。
※ブロックは変数と同じように処理されると考えてください。

<!-- BEGIN_MODULE モジュール1 -->
    <!-- BEGIN_MODULE モジュール2 -->
        <!-- BEGIN_MODULE モジュール3 -->
            {変数a}
        <!-- END_MODULE モジュール3 -->
   <!-- END_MODULE モジュール2 -->
<!-- END_MODULE モジュール1 -->

ここで、「モジュール3 の 変数a が モジュール1 の情報を使いたい」場合を想定してみましょう。この場合のエスケープ方法は下記の様になります。

<!-- BEGIN_MODULE モジュール1 -->
  <!-- BEGIN_MODULE モジュール2 -->
    <!-- BEGIN_MODULE\ モジュール3 -->
      \\{変数a\\}
    <!-- END_MODULE\ モジュール3 -->
  <!-- END_MODULE モジュール2 -->
<!-- END_MODULE モジュール1 -->

例を見ると、モジュール3 のバックスラッシュは 1つ なのに対して、変数a のバックスラッシュは2つになります。

モジュールの特徴

  • エスケープ消費量…テンプレート全体の処理一回につき1つ消費される。
  • 入れ子になっていた場合、内側のモジュールから処理される。
  • エスケープすることによって、テンプレート内のエスケープしていないモジュールを処理した後に処理される。

変数/ブロックの特徴

  • エスケープ消費量…親要素のモジュールが一つ実行される毎に1つ。

このように、モジュールは1つエスケープするとテンプレート内のエスケープされていない全てのモジュール処理が終わった後に処理してくれるようになります。対して「変数/ブロック」の場合は囲われている親要素のモジュール分だけエスケープする必要があります。モジュールを3重以上にする実装はなかなかしないかもしれませんが、もし何重にも入れ子にしたい場合はモジュールと変数/ブロックの違いに気をつけてください。

タグ