Как положить значение в page.data из form actions SvelteKit?

Только изучаю SvelteKit. Пытаюсь сделать авторизацию. Сделал вот так:

<script lang="ts">
    import { goto } from "$app/navigation";
    import Button from "$lib/components/Button.svelte";
    import Input from "$lib/components/Input.svelte";
    import { routes, USER_COOKIE_TOKEN_NAME } from "$lib/configs";
    import IconSignIn from "$lib/icons/IconSignIn.svelte";
    import type { User, UserSignin, UserSignup } from "$lib/models/users";
    import { signin, signup } from "$lib/services/usersService";
    import Cookies from "js-cookie";
    import { jwtDecode } from "jwt-decode";


    export let data;

    if (data.user !== null) {
        goto(routes.HOME);
    }

    async function onSubmit(event: SubmitEvent) {
        event.preventDefault();

        const formData = {};
        for (const element of event.target!.elements) {
            if (element.name && element.tagName === 'INPUT') {
                formData[element.name] = element.value;
            }
        }

        const userSignin: UserSignin = {
            username: formData.username,
            password: formData.password
        };
        const token = await signin(userSignin);
        if (token === null) {
            return;
        }

        let value: User | null = null;
        try {
            value = jwtDecode<User>(token.access_token);
        }
        catch (exception: unknown) {
            /* empty */
        }

        data.user = value;

        Cookies.set(USER_COOKIE_TOKEN_NAME, token.access_token);

        goto(routes.HOME);
    }
</script>

<h1>Войти в аккаунт</h1>
<form method="POST" on:submit={onSubmit}>
    <Input name="mail" type="email" placeholder="Почта" />
    <Input name="password" type="password" placeholder="Пароль" />
    <Button type="submit" text="Войти" />
</form>

Но кажется, что это неправильная реализация. Есть ведь form actions. Но как с form actions можно положить текущего декодированного пользователя в page.data, чтобы он был доступен у всех дочерних компонентов?

И как потом считывать куки с токеном, если у него будет стоять флаг httpOnly? Кажется неправильным снимать этот флаг после установки.

Сервер с API у меня уже есть на питоне и await signin(userSignin); как раз отправляет запрос с помощью axios на вход.


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