こんばんは、Webプログラマの篠田です。
朝方でもだいぶ暑く、満員電車で体力を削られてしまい出社するだけでなんだか疲れてしまいそうになる季節ですね。
今回は前回から引き続き、テンプレートエンジン「twig」の基本的な表示方法関係のお話を中心にご紹介していきます。
単純に文字を出力してみる
前回、さらっと書いて深く説明をしなかった下記の基本的な記述をもとにtwigの基本的な書き方を見ていきます。
1 2 3 4 5 6 7 8 |
<?php require_once './vendor/autoload.php'; $loader = new Twig_Loader_String(); $twig = new Twig_Environment($loader); echo $twig->render(‘<h1>Hello {{ message }}!</h1>', array('message' => 'twig World')); |
「$twig->render」メソッドの第1引数に出力したいHTMLや文章を渡し、第2引数で第1引数の値の中で使用されているtwig変数の値を配列で指定します。
twig変数というのが「{{ message }}」の部分になります。
twig変数「{{ message }}」の「message」は、「$twig->render」メソッドの第2引数として渡した連想配列「array(‘message’=>’twig World’)」の添字名と一致します。
そしてtwigの「{{ }}」は、PHPでいうところの「echo」と同じような意味として使います。
※つまり「{{ }}」を使うことで文字列を出力することができますが、配列やオブジェクトなどの塊ごと一気に表示することはできません。
twigを使うときは、連想配列を使って表示したい値をtwig側に送り、添字名を指定して「{{ }}」で出力を行います。
1 |
Hello twig World! |
twigは初期設定としてHTMLタグをエスケープする
twigのいいところは、渡す値にHTMLタグや特殊文字が含まれていても自動的に、値をエスケープして安全に出力してくる点が挙げられます。
1 2 3 4 5 6 7 |
<?php require_once './vendor/autoload.php'; $loader = new Twig_Loader_String(); $twig = new Twig_Environment($loader); echo $twig->render(‘ {{ message }}', array('message' => '<h1>Hello twig World!</h1>')); |
今回は添字「message」の連想配列の値に「<h1>Hello twig World!</h1>」を代入して、「{{ message }}」で出力します。
素直に考えると「h1タグ」に囲まれて文字フォントが大きくなった「Hello twig World!」をイメージしますが、実行すると下記のようになります。
1 |
<h1>Hello twig World!</h1> |
ソースコードを見てみると下記のようになります。
1 |
<h1>Hello twig World!</h1>gt; |
しっかりとエスケープされていますね。
twigを利用することで悪意のあるコードが紛れ込んでいても実行される危険性が低くなります。
※あくまでも変数の中に紛れ込んでいた時のみ対応可能ですがそれ以外のところに紛れていたら。。。。そのようなことがないように作りましょう。
エスケープをしないで表示させたい
プログラムを作っていると、いろいろな要望があがってきます。
もちろん、エスケープせずにHTMLタグを表示させたいというのもその1つです。
twigは自動でHTMLタグや特殊文字などをエスケープしますが、エスケープをせずに表示させることも可能です。
1 2 3 4 5 6 7 |
<?php require_once './vendor/autoload.php'; $loader = new Twig_Loader_String(); $twig = new Twig_Environment($loader); echo $twig->render(‘ {{ message | raw }}', array('message' => '<h1>Hello twig World!</h1>')); |
注目してほしいのは、「{{ message }}」だったところが「{{ message | raw}}」になっている点です。
この「raw」というのは、twigの「フィルター」と呼ばれる機能の1つで、時間のフォーマットや数字の絶対値への変換など、表示のときに役に立つ機能をいくつか利用されています。
「フィルター」を利用するときは、twigの変数の横に「|」を書いて、フィルタ名を指定します。
「raw」は、「エスケープを行わない」というフィルタで、「raw」フィルターをつけた変数のみ、エスケープを行わずに出力させることができます。
「フィルター」は、自分で作ることもできます。
twigで用意されていない、必要そうなものがあれば自分で作ることで作業を効率化ができそうですね。
改行コードもtwigで変換する
改行コード(\nや\rや\r\n)を
タグに変換することも意外と多いと思います。
PHPであれば「nl2br」関数を使って改行コードを<br>タグに直したりします。
twigでも同じように「改行コード」を「改行タグ」に変換してくれるフィルターがあります。
1 2 3 4 5 6 7 8 |
<?php require_once './vendor/autoload.php'; $loader = new Twig_Loader_String(); $twig = new Twig_Environment($loader); echo $twig->render('{{ message | nl2br }}', array('message' => "Hello twig World!")); |
twigにもPHP同様に「nl2br」というフィルターが存在します。
これを利用すれば改行コードを含む文字列も意図した形で表示されます。
ただ、改行コードを文字として入力する場合は注意が必要です。
下記のようなプログラムを用意しました。
1 2 3 4 5 6 7 |
<?php require_once './vendor/autoload.php'; $loader = new Twig_Loader_String(); $twig = new Twig_Environment($loader); echo $twig->render('{{ message | nl2br }}', array('message' => 'Hello twig \n World!')); |
意図としては「twig」と「World!」の間で改行を入れたかったのですが、これは正常に動作しません。
ポイントは、「Hello twig \n World!」という文字列を囲んでいる「’(シングルクォーテーション)」です。
見えない改行コードであれば、「”」も「’」も関係なく動作するのですが、「\n」のように明示的に記述する場合は、「”」と「’」で大きな違いがでてしまいます。
「\n」のように記述する場合は「”」で囲むことで「nl2br」フィルターが正常に動作します。
まとめ
twigの便利さが前回よりは伝わりましたか?
次回からさらに便利な使い方などをご紹介していきたいと思います。