Add authentication in frontend.
This commit is contained in:
Alexis Lahouze
parent
d4472925ee
commit
8bcabee6dd
|
|
@ -19,28 +19,33 @@ var accountantApp = angular.module("accountantApp", [
|
|||
"mgcrea.ngStrap",
|
||||
"highcharts-ng",
|
||||
"jlareau.pnotify",
|
||||
"http-auth-interceptor",
|
||||
"Storage.Service",
|
||||
"xeditable"
|
||||
])
|
||||
|
||||
.config(function($httpProvider, $routeProvider, $locationProvider) {
|
||||
// Define interceptors.
|
||||
$httpProvider.interceptors.push(function($q, notificationService) {
|
||||
return {
|
||||
"response": function(response) {
|
||||
if(response.data.ok === false) {
|
||||
return $q.reject(response);
|
||||
}
|
||||
// TODO Intercept validation error.
|
||||
return response;
|
||||
},
|
||||
.factory("sessionInjector", ["$storage", function($storage) {
|
||||
var sessionInjector = {
|
||||
request : function(config) {
|
||||
var token = $storage.get('token');
|
||||
|
||||
"responseError": function(response) {
|
||||
// TODO Intercept Authentication Required error
|
||||
notificationService.error(response.data.text);
|
||||
return $q.reject(response);
|
||||
if(token) {
|
||||
var token_type = $storage.get('token_type');
|
||||
var authorization = token_type + " " + token;
|
||||
config.headers["Authorization"] = authorization;
|
||||
}
|
||||
};
|
||||
});
|
||||
return config;
|
||||
}
|
||||
};
|
||||
|
||||
return sessionInjector;
|
||||
}])
|
||||
|
||||
|
||||
.config(["$httpProvider", "$routeProvider", "$locationProvider", "$storageProvider",
|
||||
function($httpProvider, $routeProvider, $locationProvider, $storageProvider) {
|
||||
// Define interceptors.
|
||||
$httpProvider.interceptors.push('sessionInjector');
|
||||
|
||||
// Defining template and controller in function of route.
|
||||
$routeProvider.when('/account/:accountId/operations', {
|
||||
|
|
@ -58,9 +63,93 @@ var accountantApp = angular.module("accountantApp", [
|
|||
|
||||
// Enable HTML5 mode.
|
||||
$locationProvider.html5Mode(true);
|
||||
})
|
||||
|
||||
// Configure storage
|
||||
// Set global prefix for stored keys
|
||||
$storageProvider.setPrefix("accountant");
|
||||
|
||||
// Change the default storage engine
|
||||
// Defaults to "local"
|
||||
$storageProvider.setDefaultStorageEngine("session");
|
||||
|
||||
// Change the enabled storage engines
|
||||
// Defaults to ['memory', 'cookie', 'session', 'local']
|
||||
$storageProvider.setEnabledStorageEngines(['local', 'session']);
|
||||
}])
|
||||
|
||||
.run(function(editableOptions) {
|
||||
editableOptions.theme = 'bs3'; // bootstrap3 theme. Can be also 'bs2', 'default'
|
||||
})
|
||||
|
||||
.controller("MainController", [
|
||||
"$scope", "$rootScope", "$http", "authService", "notify", "$storage",
|
||||
function($scope, $rootScope, $http, authService, notify, $storage) {
|
||||
$scope.dialogShown = false;
|
||||
|
||||
$scope.showLoginForm = function(e) {
|
||||
// First, if there are registered credentials, use them
|
||||
if($scope.dialogShown) {
|
||||
return;
|
||||
}
|
||||
|
||||
$scope.dialogShown = true;
|
||||
|
||||
bootbox.dialog({
|
||||
title: "Authentification requise",
|
||||
message: '<form class="form-horizontal">' +
|
||||
' <div class="form-group">' +
|
||||
' <label for="email" class="col-sm-4 control-label">Adresse email</label>' +
|
||||
' <div class="col-sm-8">' +
|
||||
' <input type="text" class="form-control" id="email" ng-model="email" placeholder="Nom d\'utilisateur">' +
|
||||
' </div>' +
|
||||
' </div>' +
|
||||
' <div class="form-group">' +
|
||||
' <label for="password" class="col-sm-4 control-label">Mot de passe</label>' +
|
||||
' <div class="col-sm-8">' +
|
||||
' <input type="password" class="form-control" id="password" ng-model="password" placeholder="Mot de passe">' +
|
||||
' </div>' +
|
||||
' </div>' +
|
||||
' </div>' +
|
||||
'</form>',
|
||||
buttons: {
|
||||
login: {
|
||||
label: "Login",
|
||||
className: "btn-primary",
|
||||
callback: function(result) {
|
||||
$scope.dialogShown = false;
|
||||
|
||||
var email = $('#email').val();
|
||||
var password = $('#password').val();
|
||||
$http.post(
|
||||
"/api/users/login",
|
||||
{
|
||||
"email": email,
|
||||
"password": password
|
||||
}
|
||||
).success(function(result) {
|
||||
// TODO Alexis Lahouze 2015-08-28 Handle callback.
|
||||
// Call to /api/login to retrieve the token
|
||||
$storage.set('token_type', result.token_type);
|
||||
$storage.set('token', result.token);
|
||||
$storage.set('expiration_date', result.expiration_date);
|
||||
|
||||
authService.loginConfirmed();
|
||||
});
|
||||
}
|
||||
},
|
||||
cancel: {
|
||||
label: "Annuler",
|
||||
className: "btn-default",
|
||||
callback: function(result) {
|
||||
authService.loginCancelled(null, "Login cancelled by user action.");
|
||||
$scope.dialogShown = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
$rootScope.$on("event:auth-loginRequired", $scope.showLoginForm);
|
||||
}])
|
||||
|
||||
;
|
||||
|
|
|
|||
|
|
@ -75,6 +75,8 @@
|
|||
<script type="text/javascript" src="{{ url_for('bower.static', filename='angular-strap/dist/angular-strap.tpl.js') }}"></script>
|
||||
<script type="text/javascript" src="{{ url_for('bower.static', filename='highcharts-ng/dist/highcharts-ng.js') }}"></script>
|
||||
<script type="text/javascript" src="{{ url_for('bower.static', filename='angular-pnotify/src/angular-pnotify.js') }}"></script>
|
||||
<script type="text/javascript" src="{{ url_for('bower.static', filename='angular-http-auth/src/http-auth-interceptor.js') }}"></script>
|
||||
<script type="text/javascript" src="{{ url_for('bower.static', filename='meanie-angular-storage/release/meanie-angular-storage.js') }}"></script>
|
||||
|
||||
<!-- xeditable -->
|
||||
<link href="{{ url_for('bower.static', filename='angular-xeditable/dist/css/xeditable.css') }}" rel="stylesheet">
|
||||
|
|
@ -83,7 +85,7 @@
|
|||
|
||||
<body style="padding-bottom: 50px; padding-top: 70px">
|
||||
<!-- Navbar -->
|
||||
<nav class="navbar navbar-fixed-top navbar-inverse" ng-controller="AccountController">
|
||||
<nav class="navbar navbar-fixed-top navbar-inverse">
|
||||
<div class="container-fluid">
|
||||
<!-- Brand -->
|
||||
<div class="navbar-header">
|
||||
|
|
@ -92,7 +94,7 @@
|
|||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="container-fluid">
|
||||
<div class="container-fluid" ng-controller="MainController">
|
||||
<div ng-view></div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue