I am having some trouble with implementing authorization cookies.
When I make a GET request to my api (which is running on port 8080) from my react frontend (which is running on port 3000), the cookies which I set with express are not received in the frontend.
I'm implementing a subdomain per client type of application, and the cookies are rightfully received on the normal "localhost". However, when I try to use like example.localhost, the cookies are not received at all.
I tried to do it both with axios and normal fetches, and I just can't seem to get it to work.
I used Same-Site, Secure etc and set credentials to true both in CORS and Axios.
Here are a couple snippets:
app.get('/api/dashboard/overview', (req, res) => {
res.cookie("test", "test", {httpOnly: false}); //Already tried Secure etc
res.send('Cookie was set!');
});
getRequest('/dashboard/overview').then(response => {
console.log(response.data);
return response;
});
export function getRequest(url) {
return axios.get(apiUrl + url, {withCredentials: true, headers: { crossDomain: true, 'Content-Type': 'application/json' }});
}
I think the problem lies in the subdomain.localhost stuff, but sometimes the cookies do not load on normal localhost either.
I already tried to add a domain to vhosts, but it did not work either.
Hope one of you guys could help!
If your web server is running on localhost:8080, try to add this property to cors object. Might can do the trick.
origin: 'http://localhost:8080'