403 Forbidden CSRF Verification Failed React Django

Добрый день,

Я пытался установить csrftoken, чтобы мой вход был безопасным. Я следовал инструкциям из вопроса this stackoverflow, но мне не повезло. Я провел несколько экспериментов, установив SESSION_COOKIE_SECURE на False и CSRF_COOKIE_SECURE на False. Я также пробовал различные варианты именования X-CSRFToken в заголовках на csrftoken и X-CSRFTOKEN, но ни один из них не сработал. Есть предложения?

Edit: Я также тестирую его в режиме инкогнито. Возможно, в этом может быть проблема?

views.py

@ensure_csrf_cookie
def login_view(request):
    if request.method == "POST":
         data = json.loads(request.body)
         # Attempt to sign user in
         username = data.get("username")
         password = data.get("password")

settings.py

SESSION_COOKIE_SECURE = True

CSRF_COOKIE_SECURE=True

login.js

 function getCookie(name) {
        let cookieValue = null;
        if (document.cookie && document.cookie !== '') {
            const cookies = document.cookie.split(';');
            for (let i = 0; i < cookies.length; i++) {
                const cookie = cookies[i].trim();
                // Does this cookie string begin with the name we want?
                if (cookie.substring(0, name.length + 1) === (name + '=')) {
                    cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
                    break;
                }
            }
        }
        return cookieValue;
    }
    const csrftoken = getCookie('csrftoken');


 fetch('/api/login', {
            credentials:'include', 
            method: 'POST',
            headers: {
                'X-CSRFToken': csrftoken,
            },
            body: JSON.stringify({
                username: username,
                password: password
               
            })
        })

 <form onSubmit={handleSubmit}>
        <CSRFToken/>
 </form>

csrftoken.js

import React from 'react';


function getCookie(name) {
    let cookieValue = null;
    if (document.cookie && document.cookie !== '') {
        let cookies = document.cookie.split(';');
        for(let i = 0; i < cookies.length; i++) {
            var cookie = cookies[i].toString().replace(/^([\s]*)|([\s]*)$/g, "");
            if (cookie.substring(0, name.length + 1) === (name + '=')) {
                cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
                break;
            }
        }
    }
    return cookieValue;
}


var csrftoken = getCookie('csrftoken');

const CSRFToken = () => {
    return (
        <input type="hidden" name="csrfmiddlewaretoken" value={csrftoken} />
    );
};
export default CSRFToken;

<script type="text/javascript">window.CSRF_TOKEN="{{ csrf_token }}"</script>