Как сделать авторизацию Vue + FastAPI

Учусь писать на Vue, стотлкнулся с проблемой, что не могу сделать нормально авторизацию. Сервер сам записывает Куки с токеном в браузер, а затем считывает, когда перехлдишь на другие страницы. Backend часть написана на FastAPI с использованием fastapi_users. Мне нужно отправлять запрос так, чтобы после этого у меня сохранялась кука в браузер корректно и сервер мог ее считать.

на страницt авторизации есть метод на @submit

loginUser() {
      if (this.validateForm()) {
        const formData = new URLSearchParams();
        // Добавляем поля формы
        for (const [key, value] of Object.entries(this.loginForm)) {
          formData.append(key, value);
        }



        fetch("http://127.0.0.1:8887/api/auth/jwt/login", {
          method: "POST",
          credentials: 'include',
          headers: {
            'Content-Type': 'application/x-www-form-urlencoded'
          },
          body: formData
        })
            .then(response => {
              console.log({"resp": response})
            })

      }
    }

настройка cors

app.add_middleware(
    CORSMiddleware,
    # todo брать хост и порт из конфига
    allow_origins=["http://127.0.0.1:5173"],
    allow_credentials=True,
    allow_methods=["*"],
    allow_headers=["*"],
)

код для работы с куками

cookie_transport = CookieTransport(
    cookie_name='TutoringServiceFastAPIAuth',
    cookie_max_age=3600,  # токен выдается на час
    cookie_secure=False,
    cookie_samesite='none'
)


def get_jwt_strategy() -> JWTStrategy:
    return JWTStrategy(secret=TOKEN_SECRET, lifetime_seconds=3600)


auth_backend = AuthenticationBackend(
    name="jwt",
    transport=cookie_transport,
    get_strategy=get_jwt_strategy,
)

поля allow_methods=["*"], allow_headers=["*"] для того, чтобы я мог тестировать это дела на http без https

Если я делаю авторизацию в swagger, то тамвсе работает как надо, но через Vue почему-то не так, как хотелось бы

ниже это то, что у меня в куках после запроса на авторизацию