Blade error when script has json with '@' charachter

[baselshlewett]

Laravel Version

12.20

PHP Version

8.3

Database Driver & Version

No response

Description

Starting from Laravel 12.20, blade would render '@' characters inside script tags and json as a blade directive and cause the website to break.

After reviewing the change logs and the code I have, it is actually related to the new context directive.
However, the new context directive will create a conflict with Google's guidelines about Structured Data.

Following link: https://developers.google.com/search/docs/appearance/structured-data/sd-policies#nesting

Example code:
<script type="application/ld+json"> { "@context": "https://schema.org/", "@type": "WebSite", "name": "example", "url": "https://www.example.com/", "potentialAction": { "@type": "SearchAction", "target": "https://www.example.com", "query-input": "required name=search_term_string" } } </script>

Exception thrown:
Error 0 : ParseError: syntax error, unexpected end of file, expecting "elseif" or "else" or "endif" in /storage/framework/views/665ce16f4392ee56ab0de4ed36b8f65e.php:459 Stack trace: #0 /var/www/html/vendor/laravel/framework/src/Illuminate/Filesystem/Filesystem.php(124): Illuminate\Filesystem\Filesystem::Illuminate\Filesystem\{closure}() #1 /var/www/html/vendor/laravel/framework/src/Illuminate/View/Engines/PhpEngine.php(57): Illuminate\Filesystem\Filesystem->getRequire() #2 /var/www/html/vendor/laravel/framework/src/Illuminate/View/Engines/CompilerEngine.php(76): Illuminate\View\Engines\PhpEngine->evaluatePath() #3 /var/www/html/vendor/laravel/framework/src/Illuminate/View/View.php(208): Illuminate\View\Engines\CompilerEngine->get() #4 /var/www/html/vendor/laravel/framework/src/Illuminate/View/View.php(191): Illuminate\View\View->getContents() #5 /var/www/html/vendor/laravel/framework/src/Illuminate/View/View.php(160): Illuminate\View\View->renderContents() #6 /var/www/html/vendor/laravel/framework/src/Illuminate/Http/Response.php(78): Illuminate\View\View->render() #7 /var/www/html/vendor/laravel/framework/src/Illuminate/Http/Response.php(34): Illuminate\Http\Response->setContent() #8 /var/www/html/vendor/laravel/framework/src/Illuminate/Routing/ResponseFactory.php(61): Illuminate\Http\Response->__construct() #9 /var/www/html/vendor/laravel/framework/src/Illuminate/Foundation/helpers.php(868): Illuminate\Routing\ResponseFactory->make() #10 /var/www/html/app/Http/Controllers/Web/NewsController.php(108): response() #12 /var/www/html/vendor/laravel/framework/src/Illuminate/Routing/CallableDispatcher.php(39): Illuminate\Routing\RouteFileRegistrar::{closure}() #13 /var/www/html/vendor/laravel/framework/src/Illuminate/Routing/Route.php(243): Illuminate\Routing\CallableDispatcher->dispatch() #14 /var/www/html/vendor/laravel/framework/src/Illuminate/Routing/Route.php(214): Illuminate\Routing\Route->runCallable() #15 /var/www/html/vendor/laravel/framework/src/Illuminate/Routing/Router.php(808): Illuminate\Routing\Route->run() #16 /var/www/html/vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php(169): Illuminate\Routing\Router->Illuminate\Routing\{closure}() #17 /var/www/html/vendor/laravel/nightwatch/src/Hooks/RouteMiddleware.php(34): Illuminate\Pipeline\Pipeline->Illuminate\Pipeline\{closure}() #18 /var/www/html/vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php(208): Laravel\Nightwatch\Hooks\RouteMiddleware->handle() #19 /var/www/html/vendor/barryvdh/laravel-debugbar/src/Middleware/InjectDebugbar.php(59): Illuminate\Pipeline\Pipeline->Illuminate\Pipeline\{closure}() #20 /var/www/html/vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php(208): Barryvdh\Debugbar\Middleware\InjectDebugbar->handle() #21 /var/www/html/app/Http/Middleware/RedirectHandler.php(29): Illuminate\Pipeline\Pipeline->Illuminate\Pipeline\{closure}() #22 /var/www/html/vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php(208): App\Http\Middleware\RedirectHandler->handle() #23 /var/www/html/vendor/laravel/framework/src/Illuminate/Routing/Middleware/SubstituteBindings.php(50): Illuminate\Pipeline\Pipeline->Illuminate\Pipeline\{closure}() #24 /var/www/html/vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php(208): Illuminate\Routing\Middleware\SubstituteBindings->handle() #25 /var/www/html/vendor/laravel/framework/src/Illuminate/Foundation/Http/Middleware/VerifyCsrfToken.php(87): Illuminate\Pipeline\Pipeline->Illuminate\Pipeline\{closure}() #26 /var/www/html/vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php(208): Illuminate\Foundation\Http\Middleware\VerifyCsrfToken->handle() #27 /var/www/html/vendor/laravel/framework/src/Illuminate/View/Middleware/ShareErrorsFromSession.php(48): Illuminate\Pipeline\Pipeline->Illuminate\Pipeline\{closure}() #28 /var/www/html/vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php(208): Illuminate\View\Middleware\ShareErrorsFromSession->handle() #29 /var/www/html/vendor/laravel/framework/src/Illuminate/Session/Middleware/StartSession.php(120): Illuminate\Pipeline\Pipeline->Illuminate\Pipeline\{closure}() #30 /var/www/html/vendor/laravel/framework/src/Illuminate/Session/Middleware/StartSession.php(63): Illuminate\Session\Middleware\StartSession->handleStatefulRequest() #31 /var/www/html/vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php(208): Illuminate\Session\Middleware\StartSession->handle() #32 /var/www/html/vendor/laravel/framework/src/Illuminate/Cookie/Middleware/AddQueuedCookiesToResponse.php(36): Illuminate\Pipeline\Pipeline->Illuminate\Pipeline\{closure}() #33 /var/www/html/vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php(208): Illuminate\Cookie\Middleware\AddQueuedCookiesToResponse->handle() #34 /var/www/html/vendor/laravel/framework/src/Illuminate/Cookie/Middleware/EncryptCookies.php(74): Illuminate\Pipeline\Pipeline->Illuminate\Pipeline\{closure}() #35 /var/www/html/vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php(208): Illuminate\Cookie\Middleware\EncryptCookies->handle() #36 /var/www/html/vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php(126): Illuminate\Pipeline\Pipeline->Illuminate\Pipeline\{closure}() #37 /var/www/html/vendor/laravel/framework/src/Illuminate/Routing/Router.php(807): Illuminate\Pipeline\Pipeline->then() #38 /var/www/html/vendor/laravel/framework/src/Illuminate/Routing/Router.php(786): Illuminate\Routing\Router->runRouteWithinStack() #39 /var/www/html/vendor/laravel/framework/src/Illuminate/Routing/Router.php(750): Illuminate\Routing\Router->runRoute() #40 /var/www/html/vendor/laravel/framework/src/Illuminate/Routing/Router.php(739): Illuminate\Routing\Router->dispatchToRoute() #41 /var/www/html/vendor/laravel/framework/src/Illuminate/Foundation/Http/Kernel.php(200): Illuminate\Routing\Router->dispatch() #42 /var/www/html//vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php(169): Illuminate\Foundation\Http\Kernel->Illuminate\Foundation\Http\{closure}() #43 /var/www/html/vendor/barryvdh/laravel-debugbar/src/Middleware/InjectDebugbar.php(59): Illuminate\Pipeline\Pipeline->Illuminate\Pipeline\{closure}() #44 /var/www/html/vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php(208): Barryvdh\Debugbar\Middleware\InjectDebugbar->handle() #45 /var/www/html/vendor/laravel/framework/src/Illuminate/Foundation/Http/Middleware/PreventRequestsDuringMaintenance.php(109): Illuminate\Pipeline\Pipeline->Illuminate\Pipeline\{closure}() #46

Steps To Reproduce

1. run any Laravel project with version 12.20
2. add any json that has '@context' for example below:
   <script> { '@context' } </script>

[crynobone]

Shouldn't the script be wrapped within @verbatim? https://laravel.com/docs/12.x/blade#the-at-verbatim-directive

[baselshlewett]

Shouldn't the script be wrapped within @verbatim? https://laravel.com/docs/12.x/blade#the-at-verbatim-directive

Interesting, when I initially tried it, it didn't work. Maybe I simply didn't clear the cache correctly.

However, I think the related docs should be made a little bit more clear around using @verbatim

[dwightwatson]

This looks to have popped up for me too after upgrading from Laravel 12.19.3 to 12.20.

It's not quite as simple as wrapping the whole thing in @verbatim as I also use Blade to render some URLs in my linking data.

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Organization",
  "name": "...",
  "url": "{{ route('home') }}",
  "logo": "{{ asset('images/logo.svg') }}",
  "image": "{{ asset('images/og-default.png') }}",
}
</script>

[dwightwatson]

Additional context and solutions here: #56146

[baselshlewett]

I'm also looking at other solutions for printing JSOD-D data in blade directives.

However for more context to what happened to me:

We initially had a production breaking bug that eventually led to us having to do a rollback.
But probably because of a broken pipeline I assume(which I haven't had the time to review and refactor), we run composer update after each deployment and because of the composer.json dependency rules ("laravel/framework": "^12.0"), this caused the application to update automatically to 12.20 without controlled and thorough testing.

It eventually took me an hour with the website being down to actually notice and think about checking Laravel versions between staging and production, which led me to read the change logs and notice the new '@context' directive.
And since I wasn't planning to deploy/upgrade Laravel before testing locally and on staging servers, this weird conflict made it into production.

So I don't know if this is more a developer error, or something that needs further attention from the Laravel team.

PS: It was a late night issue and being sleep deprived didn't really help with identifying the issue and doing proper debugging in a timely manner :D

[SanderSander]

This looks to have popped up for me too after upgrading from Laravel 12.19.3 to 12.20.

It's not quite as simple as wrapping the whole thing in @verbatim as I also use Blade to render some URLs in my linking data.

I encountered the same problem, put the mistake is actually the improper use of the @, The following will fix the issue.

I guess it's good practice to always escape your @ in your blade files, or use the @verbatim directive, or https://laravel.com/docs/12.x/blade#rendering-json

<script type="application/ld+json">
{
  "@@context": "https://schema.org",
  "@@type": "Organization",
  "name": "...",
  "url": "{{ route('home') }}",
  "logo": "{{ asset('images/logo.svg') }}",
  "image": "{{ asset('images/og-default.png') }}",
}
</script>