今回は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 !!}」記法は使わないようにしましょう。