【Laravel】htmlを含む変数を表示させる方法【エスケープ】

今回はLaravelに関する記事です。

Laravelの変数を表示させる際に、htmlタグをそのまま表示させたいときに行う処理についてです。

Laravelでhtmlタグを含む変数を表示させる方法

結論、htmlタグを含む変数を表示させるには以下のようにすればOKです。

{!! $text !!}

簡単な例で説明します。

ルートで以下のように変数を渡すとします。

Route::get('post', function () {
    return view('post', ['text' => 'テキストです。<br>改行されました。']);
});

これをblade側で表示させます。

<p>{! $text !}</p>

実際に表示されるページでは以下のようになります。

テキストです。
改行されました。

このように「{!! $text !!}」とすることでhtmlタグをhtmlタグとして表示させることができます。

普段よく使う変数の表示方法は「{{ $text }}」ですよね。

この記法では、XSS攻撃を防ぐためのPHP関数である「htmlspecialcharts」が自動的に通っています。

そのため、htmlタグもエスケープされそのまま表示されるようになっています。

そのエスケープの処理をしないようにするための記法が、「{!! $text !!}」ということです。

今回紹介した方法でhtmlタグを含む変数を表示させることができるようになりますが、注意も必要です。

そもそも「{{ $text }}」の記法は、エスケープさせるためとありました。

それはXSS攻撃を防ぐためです。

XSS攻撃とは、クロスサイトスクリプティングの略です。

入力フォームなどに悪意のあるスクリプトなどが埋め込まれ、偽のアプリケーションへ誘導されたりしてしまいます。

ですから、ユーザーの入力内容を表示する際は今回の「{!! $text !!}」記法は使わないようにしましょう。

IT知識の基礎を効率よく学習するためにおすすめするのがUdemyです。

Udemyは動画で学ぶオンライン教材です。

プログラミングスクールは高額で手が出せない、特定の範囲だけ集中的に学びたいという方には特におすすめです。

動画教材なので自分のペースで進められるのもUdemyの良いところです。

私も実際にUdemyを使って基礎知識を学びました。

気になった方は以下のリンクから教材を見てみてください。