Next.js not receiving cookie from Django - django

Question

I am messing around with Next.js and regular Django to do some testing, study etc.
I am trying to make a basic authentication system that simply takes the email and password, send to the Django server and it simply returns a cookie with the user id.
When I login with valid credentials, the server returns an "OK" (as it is supposed to do), however I don't get any of the cookies I'm supposed to have (not even the default csrf token from Django).
(sample data for design testing)
Using Django 4.0.6 and Next.js 12.3.1
Login route on Django
#csrf_exempt
def login(req):
body = json.loads(req.body.decode("utf-8"))
res = None
if (User.objects.filter(email=body["email"])):
user = User.objects.get(email=body["email"])
if (user.password == body["password"]):
res = JsonResponse({"success": True})
res.status_code = 200
res.set_cookie("AuthToken", json.dumps(
{"id": user.id}),
max_age=60 * 60 * 24,
httponly=False,
samesite="strict",
)
else:
res = JsonResponse({"success": False})
res.status_code = 401
else:
res = JsonResponse({"success": False})
res.status_code = 404
res.__setitem__("Access-Control-Allow-Origin", "*")
print(res.cookies)
return res
My login page on Next
import Link from "next/link";
import { useRouter } from "next/router";
import React, { FormEvent, useState } from "react";
import styled from "styled-components";
import { CONFIG } from "../../../DESIGN_CONFIG";
export default function Login() {
const [email, setEmail] = useState("");
const [password, setPassword] = useState("");
const router = useRouter();
async function logIn(e: FormEvent) {
e.preventDefault();
const body = JSON.stringify({ email: email, password: password });
console.log(body);
console.log(process.env.API_URL);
const res = await fetch(process.env.API_URL + "login/", {
method: "POST",
body: body,
});
console.log(res);
if (res.status === 200) {
router.push("/");
}
}
return (
<Background>
<LoginForm onSubmit={logIn}>
<h1>LOGIN</h1>
<label htmlFor="email">E-Mail</label>
<input
type="email"
name="email"
id="email"
onChange={(e) => setEmail(e.target.value)}
required
/>
<label htmlFor="password">Password</label>
<input
type="password"
name="password"
id="password"
onChange={(e) => setPassword(e.target.value)}
required
/>
<button type="submit">Log In</button>
<span>
Or{" "}
<Link href="/user/sign-up">
<a>sign-up</a>
</Link>
</span>
</LoginForm>
</Background>
);
}
// This way down just got the styled-components for background and login form
Prints in the console of the body and the res (and the api route):
I'm using no middleware on Next nor Django and haven't changed anything in the _app.js.
I tried using invalid credentials and got the expected behavior.
I tried using Postman and it gets the cookies.
I tried making a simpler cookie.
res.set_cookie("AuthToken", user.id)