Запрещено (CSRF cookie не установлен.): /login/ REACT & DJANGO

Я создал фронтенд с react и бэкенд с django, и все прекрасно работает на localhost, но когда я развернул фронтенд на heroku и сделал POST запрос для входа в систему (бэкенд работает на localhost), я получил следующую ошибку:

Запрещено (CSRF cookie не установлен.): /login/

Код переднего плана:

https://pastebin.com/CHArh4JL

function getCsrf(){
        fetch("http://localhost:8000/csrf/", {
                credentials: "include",
              })
              .then((res) => {
                let csrfToken = res.headers.get("X-CSRFToken");
                setCsrf({csrf: csrfToken});
                
              })
              .catch((err) => {
                console.log(err);
              })
              
    }

    const login = (event) => {
        event.preventDefault();
        setIsLoading(true)
        fetch("http://localhost:8000/login/", {
          method: "POST",
          headers: {
            "Content-Type": "application/json",
            "X-CSRFToken": csrf.csrf,
          },
          credentials: "include",
          body: JSON.stringify({username: username, password: password}),
        })
        .then(isResponseOk)
        .then((data) => {
          console.log(data);
          setIsAuthenticated(true)
          localStorage.setItem("authenticated", true);
          setUsername('')
          setPassword('')
          setIsLoading(false)
        //   this.setState({isAuthenticated: true, username: "", password: ""});
        })
        .catch((err) => {
            console.log('inside login catch')
            console.log(csrf.csrf, 'catch')
          console.log(err);
        });
        
      }

      const isResponseOk = (response) =>{
        if (response.status >= 200 && response.status <= 299) {
          return response.json();
        } else {
          console.log(response)
          throw Error(response.statusText);
        }
      }
      useEffect(() => {
        //getSessions
        setIsLoading(true)
        fetch("http://localhost:8000/session/", {
            credentials: "include",
          })
          .then((res) => res.json())
          .then((data) => {
            // console.log(data);
            if (data.isAuthenticated) {
              setIsAuthenticated(true)
              
              console.log(data)
            } else {
                // test()
              setIsAuthenticated(false)
              console.log(data)
                
              getCsrf()
            }
            setIsLoading(false)
          })
          .catch((err) => {
            console.log(err);
          });
        
       
      }, [])
      
   

код бэкенда:

https://pastebin.com/sXv1AWhK

@require_POST
# @csrf_exempt
def login_view(request):
   
    print(request.body)
    data = json.loads(request.body)
    print(data)
    username = data.get('username')
    password = data.get('password')
    # username = None
    # password = None
    # newUser = DjangoUser(username="test", password="test")
    # newUser.save()

    if username is None or password is None:
        return JsonResponse({'detail': 'Please provide username and password.'}, status=400)

    user = authenticate(username=username, password=password)

    if user is None:
        return JsonResponse({'detail': 'Invalid credentials.'}, status=400)

    login(request, user)
    return JsonResponse({'detail': 'Successfully logged in.'})

@ensure_csrf_cookie
def session_view(request):
    if not request.user.is_authenticated:
        return JsonResponse({'isAuthenticated': False})

    return JsonResponse({'isAuthenticated': True})

Вот мой settings.py

https://pastebin.com/nqRVy6ty

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