почти рабочая авторизация. оказывается сейчас нет payload у запроса, поэтому невозможно распарсить из него json.

static/login.html

@@ -61,13 +61,8 @@
 
 <div id="form-wrapper">
     <h1> Вход </h1>
-    <form method="POST" id="login-form">
-<!--        {% csrf_token %}-->
-<!--        {% if message %}-->
-<!--        <div class="form-row value-bad">-->
-<!--            {{ message }}-->
-<!--        </div>-->
-<!--        {% endif %}-->
+    <form id="login-form" onsubmit="submitLoginForm(); return false">
+        <div class="form-row value-bad" hidden id="form-error-message"></div>
 
         <div class="form-row">
             <label for="username">Имя пользователя</label>
@@ -97,6 +92,41 @@
             document.getElementById("login-form").submit()
         }
     }
+
+    const loginForm = document.getElementById('login-form');
+    const formErrorMessage = document.getElementById('form-error-message')
+
+    function submitLoginForm() {
+        const username = document.getElementById('username').value
+        const password = document.getElementById('password').value
+
+        const requestData = {
+            "username": username,
+            "password": password
+        };
+
+        fetch('/login', {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json'
+            },
+            body: JSON.stringify(requestData)
+        }).then(response => {
+            // Обработка ответа сервера
+            response.json().then((value) => {
+                if (value["error"]) {
+                    formErrorMessage.innerText = value["error"]
+                    formErrorMessage.removeAttribute("hidden")
+                } else {
+                    window.location = "/"
+                }
+            })
+        }).catch(error => {
+            formErrorMessage.innerText = error
+            formErrorMessage.removeAttribute("hidden")
+            console.error('Ошибка отправки запроса:', error) // Обработка ошибки отправки запроса
+        })
+    }
 </script>
 </body>
 </html>