Next.js не получает cookie от Django

Я возился с Next.js и обычным Django, чтобы провести некоторые тесты, исследования и т.д.

Я пытаюсь сделать базовую систему аутентификации, которая просто принимает email и пароль, отправляет их на сервер Django, а он просто возвращает cookie с идентификатором пользователя.

Когда я вхожу в систему с действительными учетными данными, сервер возвращает "OK" (как он и должен делать), однако я не получаю ни одного из файлов cookie, которые должны быть у меня (даже токена csrf по умолчанию от Django).

(выборочные данные для тестирования конструкции)

enter image description here

Используется Django 4.0.6 и Next.js 12.3.1

Маршрут входа на 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

Моя страница входа на 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

Печатает в консоли body и res (и api route):

enter image description here

Я не использую ни промежуточное ПО на Next, ни Django и ничего не менял в _app.js.

Я попробовал использовать недействительные учетные данные и получил ожидаемое поведение.

Я пробовал использовать Postman, и он получает куки.

enter image description here

Вернуться на верх