Директива json
Директива json применяется в Blade-шаблонах для преобразования PHP-переменных в JSON-формат. Она принимает один параметр - переменную любого типа, которая может быть массивом, коллекцией, объектом или простым значением. Директива автоматически экранирует кавычки и специальные символы, что делает её безопасной для использования в атрибутах data или встроенных JavaScript-скриптах.
Синтаксис
@json($variable)
Пример
Давайте передадим массив с данными в представление и выведем его в формате JSON с помощью директивы json:
<?php
namespace AppHttpControllers;
use IlluminateHttpRequest;
class UserController extends Controller
{
public function index()
{
$data = ['name' => 'John', 'age' => 30, 'city' => 'New York'];
return view('user.profile', ['data' => $data]);
}
}
?>
<div data-user="@json($data)">
<script>
const user = @json($data);
console.log(user);
</script>
</div>
Результат выполнения кода в браузере:
<div data-user="{"name":"John","age":30,"city":"New York"}">
<script>
const user = {"name":"John","age":30,"city":"New York"};
console.log(user);
</script>
</div>
Пример
Директива json также может быть использована для вывода коллекции моделей Eloquent:
<?php
namespace AppHttpControllers;
use AppModelsArticle;
class ArticleController extends Controller
{
public function show()
{
$articles = Article::where('status', 'published')->get();
return view('articles.list', ['articles' => $articles]);
}
}
?>
<script>
const articles = @json($articles);
articles.forEach(article => {
console.log(article.title);
});
</script>
Результат выполнения кода в консоли браузера:
"article 1"
"article 2"
"article 3"
Пример
В отличие от использования функции json_encode с экранированием через e, директива json обеспечивает двойную безопасность, корректно обрабатывая все краевые случаи:
@php
$data = ['key' => 'value "with quotes"', 'number' => 123, 'active' => true];
@endphp
<script>
const safe = @json($data);
const unsafe = JSON.parse('<?php echo addslashes(json_encode($data)); ?>');
console.log(safe);
</script>
Результат выполнения кода в консоли браузера:
{"key":"value \"with quotes\"","number":123,"active":true}
