Laravel Application | Only Safari is sometimes missing XSRF Cookie on Requests

Viewed 585

We've recently deployed a Laravel Application and experienced some weird issues with Some Safari Versions on our application.

When surfing on our applications, especially if the user is not authorized, we sometimes have on Safari the Problem that the XSRF-Token is not present within the Request/Response-Header.

On application Forms, the missing token results in a 419 Page expired issue.

The Problem only appears sometimes in some versions of Safari. Mostly a Reset Cache & Cookies fixes the Problem for 1 or 2 form request.

I did a complete reset of Safari

  • Allowed Cookie
  • Allowed Tracking
  • Disabled Plug-Ins

Technology

We use PHP 8.0 and the latest Laravel release. For the Frontend, there is a vue.js application with inertia.js as a connector. Regarding passing csrf-tokens to the Frontend, there is no further configuration needed to pass down the csrf-token. (Soruce)

enter image description here

I tried to capture the TokenMismatchExpection but no chance only the HTTPException works.

The question I have:

  • Does anybody experience similar problems? How can I prevent them?

Attached some Laravel Debugbar Screenshots.

left side Safari 14.03 | right side Chrome

enter image description here

Page expired screen

enter image description here

1 Answers

I ran in the same issue. I pinned the problem down to Safari ignoring the 'Set-Cookie' response header if the page was opened via a link from another site. (In my case, it's a link in an email opened in MailHog). If the link is opened in a new tab by hand, the problem is gone.

Due to the missing XSRF-TOKEN cookie, axios doesn't set the X-XSRF-TOKEN header in the requests leading to the 419 from Laravel.

So far I haven't found a feasible solution to inject the X-XSRF-TOKEN header by hand because the the VerifyCsrfToken Middleware expects the token to be an encrypted cookie.

Related