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>
|
<template>
|
||||||
<body>
|
<body>
|
||||||
<div class="logBoxCenterer">
|
<div class="logBoxCenterer">
|
||||||
<div class='loginBox'>
|
<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>
|
<h1 style="color:rgb(239,60,168); font-family: sans-serif;">SIGN IN</h1>
|
||||||
<div class="inputBox">
|
<div class="inputBox">
|
||||||
<p>USERNAME</p>
|
<p>USERNAME</p>
|
||||||
<input type="text" required>
|
<input v-model="username" type="text" required>
|
||||||
</div>
|
</div>
|
||||||
<div class="inputBox">
|
<div class="inputBox">
|
||||||
<p>PASSWORD</p>
|
<p>PASSWORD</p>
|
||||||
<input type="password" required>
|
<input v-model=password type="password" required>
|
||||||
</div>
|
</div>
|
||||||
<div class="register">
|
<div class="register">
|
||||||
<a>Register</a>
|
<a>Register</a>
|
||||||
@ -18,7 +27,7 @@
|
|||||||
<div class="inputBox">
|
<div class="inputBox">
|
||||||
<input type="submit" value="Login">
|
<input type="submit" value="Login">
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</body>
|
</body>
|
||||||
|
|||||||
@ -9,6 +9,8 @@
|
|||||||
*
|
*
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
import { getCookie } from './utils.js';
|
||||||
|
|
||||||
const default_lang = "EN";
|
const default_lang = "EN";
|
||||||
let langs;
|
let langs;
|
||||||
|
|
||||||
@ -36,22 +38,6 @@ export default function i18n(key, options) {
|
|||||||
// Those functions are utility functions use by previous exported functions.
|
// 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
|
* 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
|
* @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 != null ? lang : getCookie("lang");
|
||||||
lang = lang != "" ? lang : default_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 content = await (await fetch(filename)).text();
|
||||||
const lines = content.split("\n");
|
const lines = content.split("\n");
|
||||||
|
|
||||||
|
|||||||
@ -1,4 +1,5 @@
|
|||||||
import './assets/main.css'
|
import './assets/main.css'
|
||||||
|
import 'vue3-toastify/dist/index.css';
|
||||||
|
|
||||||
import { createApp } from 'vue'
|
import { createApp } from 'vue'
|
||||||
import App from './Login.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