Trying to create Laravel Api app that would be on a different domain with React as frontend app... when attempting to login, after fetching csrf-cookie, and making another request, I get the error:
{
"message": "Network Error",
"name": "AxiosError",
"config": {
"transitional": {
"silentJSONParsing": true,
"forcedJSONParsing": true,
"clarifyTimeoutError": false
},
"transformRequest": [
null
],
"transformResponse": [
null
],
"timeout": 0,
"xsrfCookieName": "XSRF-TOKEN",
"xsrfHeaderName": "X-XSRF-TOKEN",
"maxContentLength": -1,
"maxBodyLength": -1,
"env": {
"FormData": null
},
"headers": {
"Accept": "application/json, text/plain, */*",
"Content-Type": "application/json"
},
"withCredentials": true,
"method": "post",
"url": "http://localhost:8000/api/login",
"data": "{\"email\":\"test2@gmail.com\",\"password\":\"test\"}"
},
"code": "ERR_NETWORK",
"status": null
}
If I disable
\Laravel\Sanctum\Http\Middleware\EnsureFrontendRequestsAreStateful::class,
In my Kernel.php file, everything works fine
This is how I send the request
function submitForm(e) {
e.preventDefault();
const body = {
email: email,
password: password,
};
axios.get(csrf).then((res) => {
console.log(res);
axios.post(login, body, {withCredentials:true}).then((res) => {
console.log(res);
});
});
}
But if i remove {withCredentials:true} I get this error:
message: "Request failed with status code 419" "CSRF token mismatch."
Cors.php file:
'paths' => ['*'],
'allowed_methods' => ['*'],
'allowed_origins' => ['*'],
'allowed_origins_patterns' => [],
'allowed_headers' => ['*'],
'exposed_headers' => [],
'max_age' => 0,
'supports_credentials' => true,