You don't need to add it manually, but you have to configure Sanctum and Axios.
First things first: will your front and back ends run on the same domain, or are they subdomains of the same domain, e.g. api.app.com and app.com?
Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.
I have a csrf-token mismatch. Now I haven't really used sanctum before, so I'm trying to get some insight on how to proceed when I hit the endpoint '/sanctum/csrf-cookie'. How do I add the csrf token to my form?
<script setup>
import { ref } from "vue";
const form = ref({
email: "",
password: "",
});
const getCsrfToken = async () => {
try {
await axios.get('/sanctum/csrf-cookie');
} catch (error) {
console.error("Failed to get CSRF token:", error);
}
};
const handleLogin = async () => {
await getCsrfToken();
try {
await axios.post('/auth/login/authenticate', {
email: form.value.email,
password: form.value.password
});
} catch (error) {
console.error("Login failed:", error);
form.value.password = "";
}
};
</script>
<template>
<div class="flex flex-col justify-center items-center mt-36">
<span class="text-2xl font-semibold mb-4">Book Application 📔</span>
<div class="p-2 border border-gray-200 rounded-lg w-1/3">
<form
@submit.prevent="handleLogin"
method="post"
class="flex flex-col space-y-4"
>
<input
type="email"
name="email"
placeholder="Email"
v-model="form.email"
class="p-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"
required
/>
<input
type="password"
name="password"
placeholder="Password"
v-model="form.password"
class="p-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"
required
/>
<button
type="submit"
class="px-4 py-2 bg-blue-500 text-white rounded-lg hover:bg-blue-600 transition duration-200"
>
Login
</button>
</form>
</div>
</div>
</template>
You don't need to add it manually, but you have to configure Sanctum and Axios.
First things first: will your front and back ends run on the same domain, or are they subdomains of the same domain, e.g. api.app.com and app.com?
Please or to participate in this conversation.