I'm working on an webapp (Laravel/Vue) with a subdomain per organisation (companyone.mydomain.com, companytwo.mydomain.com, ...)
As authentication system I'm using Laravel Sanctum with cookies. While setting a cookie is working on localhost it's not working when using subdomains locally.
My backend is running on localhost:8000
while the frontend is running on localhost:8080
. For cors reasons I've added a proxy property in vue.config.js
module.exports = {
devServer: {
disableHostCheck: true,
proxy: 'http://localhost:8000',
},
};
I've changed the /etc/hosts
file so I can simulate subdomains locally
127.0.0.1 localhost
127.0.0.1 mydomain.com
127.0.0.1 companyone.mydomain.com
127.0.0.1 companytwo.mydomain.com
On the backend I've added the following lines to the .env
file (and restarted the php artisan serve
script)
SESSION_DOMAIN=.mydomain.com
SANCTUM_STATEFUL_DOMAINS=mydomain.com
In the Authcontroller I'm returning the cookie like this
$token = $user->createToken(Str::random(10))->plainTextToken;
$cookie = cookie('mydomain_api', $token, 60 * 24);
return response([
'token' => $token,
'user' => new AuthResource($user)
], 200)->withCookie($cookie);
The cookie settings are the following
$domain = null
$secure = true
$httpOnly = true
$sameSite = 'None'
When calling the login function I'm receiving the cookie in my browser like this
but Application -> Cookies stays empty
The request header
When sending another request to the api, no cookies are added. How can I get the cookie in the Cookies storage?
[EDIT 1] When hardcoding the domain on the backend to mydomain.com
I'm getting the following error in the browser