Compare commits
13 Commits
e5b1a9e46f
...
204e6a9505
Author | SHA1 | Date | |
---|---|---|---|
204e6a9505 | |||
dbbf74f2c3 | |||
0e7c18e088 | |||
6df81a66f2 | |||
aaaba0ddf3 | |||
e158fa1f87 | |||
6289be529a | |||
1f69040436 | |||
56a14a3e8a | |||
d1b4023d92 | |||
837db9aba9 | |||
09d5e1c293 | |||
8c2397c4cf |
30
Documents/JournalDeBord/authentification.md
Normal file
30
Documents/JournalDeBord/authentification.md
Normal file
@ -0,0 +1,30 @@
|
||||
# Authentification
|
||||
|
||||
## Contexte
|
||||
|
||||
Le projet demande de pouvoir authentifier les utilisateurs présents. Le but étant de leurs associer un "contexte"
|
||||
(cours, informations personnelles, ...). Pour que ceux-ci puissent accomplir différentes actions nécéssitants une
|
||||
identification (permission, personelles, ...).
|
||||
|
||||
## Méthode
|
||||
|
||||
Lorsque q'un utilisateur se connecte au serveur, nous lui envoyons un token qui sera stocké dans le
|
||||
navigateur. Ce token est unique à l'utilisateur et pourra être ré-envoyé dans les futures requetes
|
||||
pour identifier l'utilisateur.
|
||||
|
||||
## Autres méthodes envisagée
|
||||
|
||||
### Oauth2
|
||||
|
||||
C'est un protocol d'identification vastement utilisé permettant, en plus d'identifier les requettes,
|
||||
de gérer leurs permissions. Un utilisateur créen un token peut lui attribuer des permissions
|
||||
spécifique qui restrainderaients les permissions d'utilisation de ce token. C'est très utile pour
|
||||
déployer des api de site pouvant notament être accédé par des ordinateurs / bots. Ca n'est en
|
||||
revanche pas l'objectif du projet et l'option n'a donc pas été retenue
|
||||
|
||||
### Spring Sessions / Tomcat sessions
|
||||
|
||||
Il aurait été possible de laisser une librairie automatiser les sessions. Malheuresement, celà
|
||||
implique de devoir se plier au format de la dite librairie. L'implémentation d'un système de gestion
|
||||
de token maison semblai à la fois, non-imposible et interessant à notre apprentisage. C'est pourquoi
|
||||
nous n'avons pas utilisé cette option.
|
@ -1,16 +1,25 @@
|
||||
<script setup>
|
||||
import { ref } from 'vue'
|
||||
import { login } from './rest/Users.js'
|
||||
|
||||
const username = ref("");
|
||||
const password = ref("");
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<body>
|
||||
<div class="logBoxCenterer">
|
||||
<div class='loginBox'>
|
||||
<div class="form">
|
||||
<form @submit.prevent="login(username, password)" class="form">
|
||||
<h1 style="color:rgb(239,60,168); font-family: sans-serif;">SIGN IN</h1>
|
||||
<div class="inputBox">
|
||||
<p>USERNAME</p>
|
||||
<input type="text" required>
|
||||
<input v-model="username" type="text" required>
|
||||
</div>
|
||||
<div class="inputBox">
|
||||
<p>PASSWORD</p>
|
||||
<input type="password" required>
|
||||
<input v-model=password type="password" required>
|
||||
</div>
|
||||
<div class="register">
|
||||
<a>Register</a>
|
||||
@ -18,7 +27,7 @@
|
||||
<div class="inputBox">
|
||||
<input type="submit" value="Login">
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
@ -9,6 +9,8 @@
|
||||
*
|
||||
*/
|
||||
|
||||
import { getCookie } from './utils.js';
|
||||
|
||||
const default_lang = "EN";
|
||||
let langs;
|
||||
|
||||
@ -36,22 +38,6 @@ export default function i18n(key, options) {
|
||||
// Those functions are utility functions use by previous exported functions.
|
||||
//
|
||||
|
||||
/**
|
||||
* Return the content of a cookie with specified key
|
||||
* @param key cookie name
|
||||
*/
|
||||
function getCookie(key){
|
||||
key = key + "="
|
||||
let cookies = decodeURIComponent(document.cookie).split(";");
|
||||
for (let el of cookies) {
|
||||
el = el.trimStart();
|
||||
if(el.indexOf(key) == 0){
|
||||
return el.substr(key.length, el.length);
|
||||
}
|
||||
}
|
||||
return "";
|
||||
}
|
||||
|
||||
/**
|
||||
* Function that load the file with translation from the specified lang and return a dictionnary
|
||||
* @param select the language to load. could be null to fetch the cookies for an answer
|
||||
@ -61,7 +47,7 @@ export async function loadLangs(lang){
|
||||
lang = lang != null ? lang : getCookie("lang");
|
||||
lang = lang != "" ? lang : default_lang;
|
||||
|
||||
const filename = "./i18n/" + lang.toUpperCase() + ".txt";
|
||||
const filename = "/i18n/" + lang.toUpperCase() + ".txt";
|
||||
const content = await (await fetch(filename)).text();
|
||||
const lines = content.split("\n");
|
||||
|
||||
|
@ -1,4 +1,5 @@
|
||||
import './assets/main.css'
|
||||
import 'vue3-toastify/dist/index.css';
|
||||
|
||||
import { createApp } from 'vue'
|
||||
import App from './Login.vue'
|
||||
|
28
frontend/src/rest/Users.js
Normal file
28
frontend/src/rest/Users.js
Normal file
@ -0,0 +1,28 @@
|
||||
import { restGet, restPost } from './restConsumer.js'
|
||||
|
||||
export async function login(user, pass, exp){
|
||||
return restPost("/login", {login: user, password: pass, expiration: exp});
|
||||
}
|
||||
|
||||
export async function register(user, pass, mail){
|
||||
return restPost("/user", {name: user, password: pass, mail: mail});
|
||||
restPost("/login", {login: user, password: pass, expiration: exp})
|
||||
}
|
||||
|
||||
/**
|
||||
* get informations on a specific user.
|
||||
* Leaving the id empty will return the user's value based on his token
|
||||
* if the user is not authenticated. then an empty array should be returned
|
||||
*/
|
||||
export async function getUser(id){
|
||||
const endpoint = "/user" + id != null ? "/" + id : "";
|
||||
return restGet(endpoint);
|
||||
}
|
||||
|
||||
/**
|
||||
* Reserved for secretary roles. Allow to list all user on the plateform
|
||||
*/
|
||||
export async function getAllUsers(){
|
||||
return restGet("/users");
|
||||
}
|
||||
|
45
frontend/src/rest/restConsumer.js
Normal file
45
frontend/src/rest/restConsumer.js
Normal file
@ -0,0 +1,45 @@
|
||||
import { getCookie } from '../utils.js'
|
||||
import { toast } from 'vue3-toastify'
|
||||
|
||||
const restURL = import.meta.env.PROD ? "https://clyde.herisson.ovh/api" : "http://localhost:8080"
|
||||
|
||||
export async function restGet(endPoint) {
|
||||
return await _rest(endPoint, {method: "GET"});
|
||||
}
|
||||
|
||||
export async function restPost(endPoint, data) {
|
||||
return await _rest(endPoint, {method: "POST", body: data});
|
||||
}
|
||||
|
||||
export async function restDelete(endPoint, data) {
|
||||
return await _rest(endPoint, {method: "DELETE", body: data});
|
||||
}
|
||||
|
||||
export async function restPatch(endPoint, data) {
|
||||
return await _rest(endPoint, {method: "PATCH", body: data});
|
||||
}
|
||||
|
||||
/**
|
||||
* backbone for the request made by the frontend
|
||||
*
|
||||
* specification
|
||||
* - If the user has "session_token" cookie set, it will use it in the authorization field of the http request
|
||||
* - The result will be returned as a json to access fields easily ( the backend should send json response )
|
||||
*
|
||||
* @Example _rest("/ping", {user: data}) -> {id:0, txt:"pong"}
|
||||
*/
|
||||
async function _rest(endPoint, config){
|
||||
endPoint.at(0) != "/" ? console.error("Carefull, you certainly should put a / at the begenning of your endPoint ") : true;
|
||||
let session_token = getCookie("session_token");
|
||||
let headers = new Headers({'Authorization': session_token});
|
||||
config['headers'] = headers;
|
||||
return toast.promise(fetch(restURL + endPoint, config),
|
||||
{
|
||||
pending: config['pending'] != null ? config['pending'] : 'pending',
|
||||
error: config['error'] != null ? config['error'] : 'Network Failure...',
|
||||
success: config['success'] != null ? config['success'] : {render(res){
|
||||
return res.ok ? "Success" : "error";
|
||||
}},
|
||||
})
|
||||
.then( e => e.json()).catch( e => e );
|
||||
}
|
17
frontend/src/utils.js
Normal file
17
frontend/src/utils.js
Normal file
@ -0,0 +1,17 @@
|
||||
/**
|
||||
* Return the content of a cookie with specified key
|
||||
* @param key cookie name
|
||||
*/
|
||||
function getCookie(key){
|
||||
key = key + "="
|
||||
let cookies = decodeURIComponent(document.cookie).split(";");
|
||||
for (let el of cookies) {
|
||||
el = el.trimStart();
|
||||
if(el.indexOf(key) == 0){
|
||||
return el.substr(key.length, el.length);
|
||||
}
|
||||
}
|
||||
return "";
|
||||
}
|
||||
|
||||
export {getCookie};
|
Loading…
Reference in New Issue
Block a user