I have a project with Laravel Inertia and Vue Js. These day i have a problem with csrf token. I have already read the documentation here https://inertiajs.com/csrf-protection, so maybe i should add csrf token on every inertia request/response.
My question is, how to add this _token globally? So i dont need to one by one add token into my vue file, because its too much file.
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 App\Http\Middleware;
use Illuminate\Http\Request;
use Inertia\Middleware;
class HandleInertiaRequests extends Middleware
{
/**
* The root template that's loaded on the first page visit开发者_如何学Python.
*
* @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 \Illuminate\Http\Request $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 \Illuminate\Http\Request $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(),
];
},
]);
}
}
Now add csrf variable inside script at the blade file, like this.
<script>
export default {
data: () => ({
csrf: document.querySelector('meta[name="csrf-token"]').getAttribute('content'),
}),
}
</script>
You will see a meta tag in your blade.php file like this.
<meta name="csrf-token" content="{{ csrf_token() }}">
精彩评论