Commit 8a65d507 authored by Mat's avatar Mat

implémente la mécanique du bearer token dans la page biere.html

parent 73cc45c8
......@@ -3,8 +3,36 @@
<head>
<meta charset="UTF-8">
<title>Bière</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
</head>
<body>
<!-- MODALE BOOTSTRAP -->
<div class="modal" data-backdrop="static" keyboard="false">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Login</h5>
</div>
<form id="form-login">
<div class="modal-body">
<label for="username">Nom d'utilisteur</label>
<input name="username" type="text" class="form-control">
<label for="password">Mot de passe</label>
<input name="password" type="password" class="form-control">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary">Se connecter</button>
</div>
</form>
</div>
</div>
</div>
<!-- -->
<h2>Bière</h2>
<form id="biere">
<label for="nom">Nom</label>
......@@ -18,16 +46,59 @@
</select><br>
<label for="file">Image</label>
<input type="file" name="file"><br>
<img id="preview" src="http://0.0.0.0:81/web/assets/img/biere/default.jpg" alt="image" width="100" height="100">
<img id="preview" src="http://0.0.0.0:81/web/assets/img/biere/default.jpg" alt="image" height="100">
<button id="send">Envoyer</button>
</form>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
// automatise l'authentification avant chaque requête ajax
$.ajaxPrefilter(function(options) {
if (!options.beforeSend) {
options.beforeSend = function(xhr) {
// avec 2 espaces entre bearer et le token !!!!
xhr.setRequestHeader('Authorization', 'bearer ' + sessionStorage.getItem('token'));
}
}
});
// au submit du formulaire de connexion
$('#form-login button').click(function(e)
{
e.preventDefault();
let username = $('input[name=username]').val();
let password = $('input[name=password]').val();
$.ajax({
url: "http://0.0.0.0:81/web/app_dev.php/API/login_check",
dataType: 'JSON',
method: 'POST',
data: JSON.stringify({"username": username, "password": password}),
success: function(data) {
sessionStorage.setItem('token', data.token);
token = sessionStorage.getItem('token');
$('.modal').modal('hide');
},
error: function(xhr) {
alert('login failed');
}
});
});
// pas de token, affiche la modale de connexion
let token = sessionStorage.getItem('token');
if (token === null) {
// affiche une page de connexion
$('.modal').modal();
}
//console.log(token);
// select, liste des brasseries
$.get(
"http://0.0.0.0:81/web/app_dev.php/API/v2/brasserie",
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment