Cookie creation and error handling

This commit is contained in:
sprechtl 2022-09-25 22:08:38 +02:00
parent 985b94b109
commit 16af21123b
7 changed files with 149 additions and 25 deletions

View file

@ -1,11 +1,15 @@
<script lang="ts">
import {setCookie} from "nookies";
import type {Authentication} from "./models/authentication";
import { SvelteToast } from '@zerodevx/svelte-toast'
import {createErrorToast} from "../../models/customToasts";
let user: string;
let password: string;
let rememberMe: boolean = true;
async function handleSubmit() {
console.log(user, password)
const endpoint = "http://localhost:1337/api/auth/local";
const payload = {
identifier: user,
@ -21,42 +25,69 @@
body: JSON.stringify(payload)
})
const response = await login.json();
const response: Authentication = await login.json();
if (response.error != null){
if (response.error.details.errors){
for (const error of response.error.details.errors) {
createErrorToast(error.message);
}
} else{
createErrorToast(response.error.message);
}
}
if (rememberMe) {
setCookie(null, 'jwt', response.jwt, {
maxAge: 30 * 24 * 60 * 60,
path: '/'
})
// window.location = "/";
}
console.log(response);
}
</script>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>PomeloNote | Login</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-iYQeCzEYFbKjA/T2uDLTpkwGzCiq6soy8tYaI1GyVh/UjpbCx/TYkiZhlZB6+fzT" crossorigin="anonymous">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-iYQeCzEYFbKjA/T2uDLTpkwGzCiq6soy8tYaI1GyVh/UjpbCx/TYkiZhlZB6+fzT" crossorigin="anonymous">
</head>
<body>
<main class="form-signin w-100 m-auto">
<img class="mb-4" src="/docs/5.2/assets/brand/bootstrap-logo.svg" alt="Logo" width="72" height="57">
<h1 class="h3 mb-3 fw-normal">Please sign in</h1>
<img class="mb-4" src="/docs/5.2/assets/brand/bootstrap-logo.svg" alt="Logo" width="72" height="57">
<h1 class="h3 mb-3 fw-normal">Please sign in</h1>
<div class="form-floating">
<input type="email" class="form-control" id="floatingInput" placeholder="name@example.com" bind:value={user}>
<label for="floatingInput">Email address</label>
</div>
<div class="form-floating">
<input type="password" class="form-control" id="floatingPassword" placeholder="Password" bind:value={password}>
<label for="floatingPassword">Password</label>
</div>
<div class="form-floating">
<input type="email" class="form-control" id="floatingInput" placeholder="name@example.com" bind:value={user}>
<label for="floatingInput">Email address</label>
</div>
<div class="form-floating">
<input type="password" class="form-control" id="floatingPassword" placeholder="Password" bind:value={password}>
<label for="floatingPassword">Password</label>
</div>
<div class="checkbox mb-3">
<label>
<input type="checkbox" value="remember-me"> Remember me
</label>
</div>
<button class="w-100 btn btn-lg btn-primary" on:click={handleSubmit}>Sign in</button>
<p class="mt-5 mb-3 text-muted">&copy;2022</p>
<div class="checkbox mb-3">
<label>
<input type="checkbox" value="rememberMe" bind:checked={rememberMe}> Remember me
</label>
</div>
<button class="w-100 btn btn-lg btn-primary" on:click={handleSubmit}>Sign in</button>
<p class="mt-5 mb-3 text-muted">&copy;2022</p>
</main>
<SvelteToast></SvelteToast>
</body>
</html>
<style>

View file

@ -0,0 +1,7 @@
import type {User} from "../../../models/user";
export interface Authentication {
jwt: string;
user: User;
error: any;
}