今回はLaravelに関する記事です。
Laravelの変数を表示させる際に、htmlタグをそのまま表示させたいときに行う処理についてです。
Laravelでhtmlタグを含む変数を表示させる方法
結論、htmlタグを含む変数を表示させるには以下のようにすればOKです。
{!! $text !!}
htmlタグを含む変数を表示させる例
簡単な例で説明します。
ルートで以下のように変数を渡すとします。
Route::get('post', function () {
return view('post', ['text' => 'テキストです。<br>改行されました。']);
});
これをblade側で表示させます。
<p>{!! $text !!}</p>
実際に表示されるページでは以下のようになります。
テキストです。
改行されました。
このように「{!! $text !!}」とすることでhtmlタグをhtmlタグとして表示させることができます。
普段使う「{{ $text }}」との違い
普段よく使う変数の表示方法は「{{ $text }}」ですよね。
この記法では、XSS攻撃を防ぐためのPHP関数である「htmlspecialcharts」が自動的に通っています。
そのため、htmlタグもエスケープされそのまま表示されるようになっています。
そのエスケープの処理をしないようにするための記法が、「{!! $text !!}」ということです。
htmlタグを含む変数を表示させる方法の注意点
今回紹介した方法でhtmlタグを含む変数を表示させることができるようになりますが、注意も必要です。
そもそも「{{ $text }}」の記法は、エスケープさせるためとありました。
それはXSS攻撃を防ぐためです。
XSS攻撃とは、クロスサイトスクリプティングの略です。
入力フォームなどに悪意のあるスクリプトなどが埋め込まれ、偽のアプリケーションへ誘導されたりしてしまいます。
ですから、ユーザーの入力内容を表示する際は今回の「{!! $text !!}」記法は使わないようにしましょう。
エンジニアにおすすめ書籍
エンジニアになりたて、これから勉強を深めていきたいという方におすすめの書籍はこちら!