I have a project using Laravel Inertia and Vue Js. I'm having trouble with csrf tokens these days. I've read the documentation here https://inertiajs.com/csrf-protection, so maybe I should add the csrf token on every inertia request/response.
My question is, how to add this _token globally? So I don't need to add tokens to my vue file one by one because it has too many files.
My current script code on login.vue:
props: { errors: Object, session: Object, auth: Array }, //define composition API setup(props) { //define form state const form = reactive({ email: '', password: '', }); //submit method const submit = () => { //send data to server Inertia.post('/login', { //data email: form.email, password: form.password, _token: props.auth.csrf }); }
My HandleInertiaRequest (middleware):
<?php namespace AppHttpMiddleware; use IlluminateHttpRequest; use InertiaMiddleware; class HandleInertiaRequests extends Middleware { /** * The root template that's loaded on the first page visit. * * @see https://inertiajs.com/server-side-setup#root-template * @var string */ protected $rootView = 'app'; /** * Determines the current asset version. * * @see https://inertiajs.com/asset-versioning * @param IlluminateHttpRequest $request * @return string|null */ public function version(Request $request): ?string { return parent::version($request); } /** * Defines the props that are shared by default. * * @see https://inertiajs.com/shared-data * @param IlluminateHttpRequest $request * @return array */ public function share(Request $request): array { return array_merge(parent::share($request), [ //session 'session' => [ 'status' => fn () => $request->session()->get('status'), 'success' => fn () => $request->session()->get('success'), 'error' => fn () => $request->session()->get('error'), ], //user authenticated 'auth' => [ 'user' => $request->user() ? $request->user() : null, 'permissions' => $request->user() ? $request->user()->getPermissionArray() : [], 'csrf' => $request->session()->token() ], //route 'route' => function () use ($request) { return [ 'params' => $request->route()->parameters(), 'query' => $request->all(), ]; }, ]); } }
Add the csrf token globally in your
Middleware/HandleInertiaRequests.php
file.Add instances to your form.
Finally, make the call, in the example below I use the Inertia useForm() function to log in the user.