Laravel 5:使用Blade显示HTML


282

我有一个字符串返回到我的一个视图,如下所示:

$text = '<p><strong>Lorem</strong> ipsum dolor <img src="images/test.jpg"></p>'

我正在尝试使用Blade显示它:

{{$text}}

但是,输出是原始字符串,而不是呈现的HTML。如何在Laravel 5中使用Blade显示HTML?

PS。PHP echo()可以正确显示HTML。


1
{!! nl2br($post->description) !!}如果我只有空格和br,对我有用。
Muhammad Shahzad

Answers:


650

您需要使用

{!! $text !!}

使用时,字符串将自动转义{{ $text }}


5
以下是Laravel文档中提到的内容:“如果您不希望对数据进行转义,则可以使用以下语法:Hello, {!! $name !!}.laravel.com/docs/5.5/blade#displaying-data
Ryan

1
我也想知道@Ryan提到了什么。这不是安全问题吗?
桑德斯

@sanders如果$text包含用户输入并且您没有正确地对此进行转义,则很可能是安全问题。例如,这样做$text = 'Hello <b>'.$_GET['name'].'</b>';很危险,因为其中$_GET['name']可能包含允许XSS的HTML。您可以$text = 'Hello <b>'.htmlentities($_GET['name']).'</b>';并且会很安全。
克里斯托弗·K

这个剂量并不能解决整个问题!如果我有类似的东西,<meta cc="grâce à">并且想在刀片中展示,它将看起来像这样<meta cc="gr&acirc;ce &agrave;">。所以对我来说,答案是@Praveen_Dabral
brahimm '18



18

请用

{!! $test !!} 

仅在使用HTML时,如果您要呈现数据,字符串等,请使用

{{ $test }}

这是因为编译刀片文件时

{{ $test }}转换为<?php echo e($test) ?> while

{!! $test !!} 转换为 <?php echo $test ?>


13

还有另一种方式。如果对象的目的是呈现html,则可以实现\Illuminate\Contracts\Support\Htmlable具有toHtml()方法的协定。

然后,您可以像下面这样从刀片渲染该对象:({{ $someObject }}请注意,不需要{!! !!}语法)。

另外,如果您想返回html属性并且知道它将是html,请使用\Illuminate\Support\HtmlString如下所示的类:

public function getProductDescription()
{
    return new HtmlString($this->description);
}

然后像这样使用它{{ $product->getProductDescription() }}

当直接在页面上呈现原始html时,当然要负责。


11

尝试这个。它为我工作。

{{ html_entity_decode($text) }}

在Laravel Blade模板中,{{}}将转义html。如果要在视图中显示控制器中的html,请解码字符串中的html。


3
这是不对的,上面有答案,可以用您的方式完成,只会使porgrammer感到困惑
Milad,

8

您可以使用 {!!$ text !!}用于在Laravel中呈现HTML代码

{!! $text !!}

如果您使用

{{ $text }}

它不会呈现HTML代码,也不会作为字符串打印。


5

使用{!! $text !!}无需逃避它显示的数据。只要确保您不对来自用户且尚未清除的数据执行此操作。




4

如果出现以下情况,可以先使用三种方式进行操作

{!! $text !!}

这是第二种方式

<td class="nowrap">
@if( $order->status == '0' )
    <button class="btn btn-danger">Inactive</button>
@else
    <button class="btn btn-success">Active</button>
@endif
</td>

在刀片上使用三元运算符的第三种正确方法

<td class="nowrap">
      {!! $order->status=='0' ? 
          '<button class="btn btn-danger">Inactive</button> : 
          '<button class="btn btn-success">Active</button> !!}
</td>

我希望第三种方法对于刀片上的三元运算符是完美的。


4

为了进一步说明,Blade {{ }}语句中的代码会自动通过htmlspecialchars()php提供的功能传递。此函数接收一个字符串,并将查找HTML使用的所有保留字符。保留字符为& < >"。然后,将这些保留字符替换为其HTML实体变体。以下是:

|---------------------|------------------|
|      Character      |       Entity     |
|---------------------|------------------|
|          &          |       &amp;      |
|---------------------|------------------|
|          <          |       &lt;       |
|---------------------|------------------|
|          >          |       &gt;       |
|---------------------|------------------|
|          "          |       &quot;     |
|---------------------|------------------|

例如,假设我们有以下php语句:

$hello = "<b>Hello</b>";

传递到blade,{{ $hello }}将产生您传递的文字字符串:

<b>Hello</b>

在引擎盖下,它实际上会回显为 &lt;b&gt;Hello&lt;b&gt

如果我们想绕过它并实际上将其呈现为粗体标签,我们htmlspecialchars()可以通过添加转义语法刀片提供以下功能来转义该 函数:

{!! $hello !!}

请注意,我们仅使用一个花括号。

上面的输出将产生:

你好

我们还可以利用php提供的另一个便捷功能,即该html_entity_decode()功能。这会将HTML实体转换为它们受尊重的HTML字符。认为它是相反的htmlspecialchars()

例如说我们有以下php语句:

$hello = "&lt;b&gt; Hello &lt;b&gt;";

现在,我们可以将此功能添加到转义的blade语句中:

{!! html_entity_decode($hello) !!}

这将采用HTML实体&lt;并将其解析为HTML代码<,而不仅仅是字符串。

大于实体也是如此 &gt;

这将产生

你好

逃避的首要目的是避免XSS攻击。因此,在使用转义语法时要特别小心,尤其是如果应用程序中的用户自己提供HTML时,他们可以随意插入自己的代码。


2

如果要转义数据,请使用

{{ $html }}

如果不想转义数据使用

{!! $html !!}

但是直到Laravel-4你可以使用

{{ HTML::link('/auth/logout', 'Sign Out', array('class' => 'btn btn-default btn-flat')) }}

当谈到Laravel-5

{!! HTML::link('/auth/logout', 'Sign Out', array('class' => 'btn btn-default btn-flat')) !!} 

您也可以使用PHP函数执行此操作

{{ html_entity_decode($data) }}

浏览PHP文档以获取此函数的参数

html_entity_decode-php.net



1

对于在textarea中使用tinymce和标记的用户:

{{ htmlspecialchars($text) }}

0

我去过那里,这是我的错。而且非常愚蠢。

如果您忘记了文件名中的.blade扩展名,则该文件不了解Blade,但运行php代码。你应该用

/resources/views/filename.blade.php

代替

/resources/views/filename.php

希望这可以帮助一些人



By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.