Разобраться в запросе с сайта в FastAPI

Question

Помогите пожалуйста разобраться в ситуации. Пытаюсь освоить FastAPI только учусь, столкнулся с проблемой. Сделал тестовый сайт html, где пользователь вводит логин и пароль, затем делает запрос к FastAPI тот проводит аутентификацию пользователя и выдаёт данные. Столкнулся с тем, что не могу отправить логин-пароль пользователя с сайта, выдаёт ошибку: 405 Method Not Allowed. Обработка запроса идёт например вот через эти функции:

class UserInfo(BaseModel):
    salary: int
    date: str

class UserLogin(BaseModel):
    login: str
    password: str

def validate_auth_user(person: UserLogin):
    unauthed_exc = HTTPException(
        status_code=status.HTTP_401_UNAUTHORIZED,
        detail="invalid username or password",
    )
    if not (user := users_db.get(person.username)):
        raise unauthed_exc

    if not auth_utils.validate_password(
        password=person.password,
        hashed_password=user.password,
    ):
        raise unauthed_exc

    if not user.active:
        raise HTTPException(
            status_code=status.HTTP_403_FORBIDDEN,
            detail="user inactive",
        )

    return user

@router.post("/login/", response_model=UserInfo)
def auth_user_issue_jwt(
    user: UserSchema = Depends(validate_auth_user),
):
    return UserInfo(salary=user.salary, date=user.date)

Сам код сайта с скриптом таков:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link href="./style.css" rel="stylesheet">
    <title>Тестовый сайт для зарплаты</title>
</head>
<body>
    <div class="parent">
        <div class="block">
            <h1>To get data</h1>
            <form>
                <input type="text" id="login" value="" placeholder="Login"><br>
                <input type="password" id="password" value=""
                    placeholder="Password"><br>
            </form>
            <button onclick="send()" class="button">Sign in</button><br>
        </div>
    </div>

    <script>
        async function send(){

            // получаем введеное в поле 
            const login = document.getElementById("login").value;
            const password = document.getElementById("password").value;

            // отправляем запрос
            const response = await fetch("/login/", {
                    method: "POST",
                    headers: { "Accept": "application/json", "Content-Type": "application/json" },
                    body: JSON.stringify({
                        login: login,
                        password: password
                    })
                });
                if (response.ok) {
                    const data = await response.json();
                    document.getElementById("message").textContent = data.message;
                }
                else
                    console.log(response);
        }
    </script>
</body>
</html>

Старался делать по тренировочным разным материалам которые нашёл по теме, но теперь в тупике. Говорят, что напрямую FastAPI вроде как не предназначен для работы с фронтом, но всё же хотелось бы решить эту проблему...

Поправка: Если я делаю вход через http://127.0.0.1:8000/docs и ввожу там данные пользователя, то метод работает, он получает и обрабатывает логин и пароль, но вот с сайта не принимает... Я вроде сделал отдельные модели, указал их в функции, всё как в тренировочных уроках. Не понимаю. Во вкладке Network в разделе Request Payload есть json словарь с логином и паролем который на сайте ввожу, всё как надо: {username: "fdsa", password: "edcvfr"}, заголовок: http://127.0.0.1:8000/login/ почему он его не принимает? Буду благодарен за помощь....

БЛОГ НА HUSL

Разобраться в запросе с сайта в FastAPI

Ответы (0 шт):