Vue and TokenMismatchException

Hi,

I have an app based on Laravel and Vue that makes heavy use of Ajax calls.

Everything works fine , but in my logs I keep seeing a Illuminate\Session\TokenMismatchException popping up.

I am well aware of what this error means and I have set the X-CSRF-TOKEN header. I have never experienced it myself when testing the app myself.

So I guess this error has to do with expired tokens. For example, if you leave your browser open for a while, and then return, you are still logged in but with an expired csrf token. I haven't confirmed this, but it seems likely.

I tried the Caffeine for Laravel library, but it doesn't solve the problem.

So, has anyone else come across this and have do I solve it to get rid of all pesky little exceptions in my logs?

Thanks and kind regards, Patrik

kocoten1992

10 years ago

Level 10

The token is time for 2h, these are some option:

just ignore it
customize the VerifyCsrfToken.php of the framework (/vendor/laravel/framework/src/Illuminate/Foundation/Http/Middleware/VerifyCsrfToken.php), not recommend thou.
copy VerifyCsrfToken.php from the framework and modify it however you like eg: remove the throw Exception line (from handle function), and in app/Http/Kernel.php, delete the default Csrf token, and add your own

Please or to participate in this conversation.