Comment prévenir le besoin de connexion à chaque fois sans déconnexion Ionique dans les App?
Comment je peux faire mon Ionique App pour empêcher le besoin de connexion à chaque fois après la sortie de l'app ou de retour à l'arrière-plan sans déconnecter ?
Ses mon code source:
login.js
angular.module('starter.controllers')
.controller('LoginCtrl', ['$scope', '$rootScope', '$location', '$localStorage', '$q', '$http', '$window', '$state', 'AuthFac tory', 'SessionFactory',
function($scope, $rootScope, $location, $localStorage, $q, $http, $window, $cordovaSQLite, $state, AuthFactory, SessionFactory) {
$scope.login = {
email: null,
password: null
};
$scope.login = function() {
$rootScope.showLoading("Authenticating..");
var email = $scope.login.email,
password = $scope.login.password;
if (email !== undefined && password !== undefined) {
AuthFactory.login(email, password).success(function(data, status, headers, config) {
if (data.success === false) {
$rootScope.hideLoading();
$rootScope.toast('Invalid Credentials');
} else {
SessionFactory.isLogged = true;
SessionFactory.user = data.data.username;
SessionFactory.userRole = data.data.name;
$localStorage.id = data.data.id;
$localStorage.token = data.data.token;
$window.sessionStorage.token = data.data.token;
console.log($window.sessionStorage.token);
$localStorage.user = data.data.username; //to fetch the user details on refresh
console.log($localStorage.user);
$localStorage.userRole = data.data.name; //to fetch the user details on refresh
console.log($localStorage.userRole);
} //end else data.success
}).error(function(data, status, headers, config) {
if (status === 500) {
$rootScope.hideLoading();
$rootScope.toast('Invalid Email');
}
});
}
};
}
]);
authfactory.js
angular.module('starter.factories')
.factory('SessionFactory', function($window, $localStorage) {
var auth = {
isLogged: false,
check: function() {
if ($localStorage.token && $localStorage.user ) {
this.isLogged = true;
} else {
this.isLogged = false;
delete this.user;
}
}
}
return auth;
})
.factory('AuthFactory', function($window, $location, $http, SessionFactory, $localStorage) {
return {
login: function(email, password) {
return $http.post('url', {
email : email,
password: password
});
},
logout: function() {
if (SessionFactory.isLogged) {
SessionFactory.isLogged = false;
delete SessionFactory.user;
delete SessionFactory.userRole;
delete $localStorage.token;
delete $localStorage.user ;
delete $window.sessionStorage.userRole;
$location.path("/login");
}
}
}
})
.factory('TokenInterceptor', function($q, $window, $localStorage) {
return {
request: function(config) {
config.headers = config.headers || {};
if ($localStorage.token) {
config.headers['X-Access-Token'] = $localStorage.token;
config.headers['X-Key'] = $localStorage.user;
config.headers['Content-Type'] = "application/json";
}
return config || $q.when(config);
},
response: function(response) {
return response || $q.when(response);
}
};
})
app.js
angular.module('starter.controllers', []);
angular.module('starter.services', []);
angular.module('starter.factories', []);
angular.module('starter', ['ionic', 'starter.controllers', 'starter.services', 'starter.factories', 'ngCordova', 'ngRoute'])
.run(function($ionicPlatform, $rootScope, $ionicLoading, $state, $location, $q, $http, $timeout, $localStorage, $window, SessionFactory) {
$ionicPlatform.ready(function() {
//Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
//for form inputs)
if (window.cordova && window.cordova.plugins && window.cordova.plugins.Keyboard) {
cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
}
if (window.StatusBar) {
//org.apache.cordova.statusbar required
StatusBar.styleLightContent();
}
$ionicPlatform.registerBackButtonAction(function(event) {
if ($state.current.name == "tab.dashboard") {
navigator.app.exitApp();
console.log('1');
} else {
navigator.app.backHistory();
console.log('2');
}
}, 100);
if (window.cordova) {
});
//when the page refreshes, check if the user is already logged in
SessionFactory.check(); $rootScope.showLoading = function(msg) {
$ionicLoading.show({
template: msg || 'Loading',
animation: 'fade-in',
showBackdrop: true,
maxWidth: 200,
showDelay: 0
});
$timeout(function() {
$rootScope.hideLoading();
}, 2999);
}
$rootScope.hideLoading = function() {
$ionicLoading.hide();
};
$rootScope.toast = function(msg) {
$rootScope.showLoading(msg);
$timeout(function() {
$rootScope.hideLoading();
}, 2999);
};
$ionicPlatform.on('resume', function() {
$rootScope.$on("$routeChangeStart", function(event, nextRoute, currentRoute) {
if ((nextRoute.access && nextRoute.access.requiredLogin) && !SessionFactory.isLogged) {
$location.path("/login");
} else {
//check if user object exists else fetch it. This is incase of a page refresh
if (!SessionFactory.user) SessionFactory.user = $localStorage.user;
if (!SessionFactory.userRole) SessionFactory.userRole = $localStorage.userRole;
}
console.log('true');
});
$rootScope.$on('$routeChangeSuccess', function(event, nextRoute, currentRoute) {
$rootScope.showMenu = SessionFactory.isLogged;
$rootScope.role = SessionFactory.userRole;
//if the user is already logged in, take him to the home page
if (SessionFactory.isLogged == true && $location.path() == '/login') {
$location.path('/tab/price');
}
});
console.log(SessionFactory.isLogged);
$rootScope.$broadcast('onResume');
});
$ionicPlatform.on('pause', function() {
$rootScope.$broadcast('onPause');
console.log('pause');
});
})
.config(function($stateProvider, $urlRouterProvider, $httpProvider, $ionicConfigProvider) {
$httpProvider.interceptors.push('TokenInterceptor');
//Ionic uses AngularUI Router which uses the concept of states
//Learn more here: https://github.com/angular-ui/ui-router
//Set up the various states which the app can be in.
//Each state's controller can be found in controllers.js
$stateProvider
//setup an abstract state for the tabs directive
.state('login', {
url: '/login',
templateUrl: 'templates/login.html',
controller: 'LoginCtrl',
access: {
requiredLogin: false
}
})
//if none of the above states are matched, use this as the fallback
$urlRouterProvider.otherwise('/login');
});
login.html
<ion-view view-title="Ionic App">
<ion-content>
<ion-list>
<form name="loginForm">
<div class="list">
<label class="item item-input">
<input type="email" placeholder="Email" ng-model="login.email" required>
</label>
<label class="item item-input">
<input type="password" placeholder="Password" ng-model="login.password" required>
</label>
<button class="button button-block button-assertive" ng-click="login()" ng-disabled="loginForm.$invalid">
<b>Login</b>
</button>
</div>
</form>
</ion-list>
</ion-content>
</ion-view>
J'espère que quelqu'un peut m'aider à résoudre ce problème
Pourquoi ne pas ajouter un plunker au lieu de l'ajout de beaucoup de code ??
OriginalL'auteur user3077416 | 2015-07-09
Vous devez vous connecter pour publier un commentaire.
Simple et recommandé solution : Stocker des informations d'identification d'utilisateur dans le localStorage et d'effectuer la connexion automatique. Comme je vois que votre code, vous êtes déjà de stocker certaines informations sur l'utilisateur dans le localStorage. Vous pouvez vérifier si ces informations existent dans le localStorage lors de votre contrôleur de charge et appelez votre méthode de connexion directement.
Quelque chose comme ceci :
Alternativement, si vous travaillez sur certains jeton de connexion conduit d'authentification, vous pouvez également stocker le jeton et l'utiliser pour communiquer avec le serveur la prochaine fois.
N'oubliez pas d'utiliser le chiffrement si (y)
Vous pouvez montrer certains de l'écran de démarrage lorsque vous app se lance, vérifier si le nom d'utilisateur / mot de passe sont déjà stockées, si stocké puis vous connecter directement à d'autre ouvrir l'écran de connexion à la place.
[$injecteur:unpr] Inconnu fournisseur de: $localStorageProvider <- $localStorage <- connexion
OriginalL'auteur Manish Kr. Shukla
1). Dans $urlRouterProvider.dans le cas contraire("), de définir l'url de votre application tableau de bord ou la page principale, où l'utilisateur est envoyé après la connexion. Laisse supposer $urlRouterProvider.dans le cas contraire('/tableau de bord").
2). Dans le tableau de bord du contrôleur, injecter le service qui vérifie l'authentification de l'utilisateur et de l'envoyer à l'utilisateur d'ouvrir une session si non authentifiés.
OriginalL'auteur Faizan Shakeel
Il Est Possible En utilisant le stockage Local Ionique
Définir certaines informations d'identification dans le local de stockage lorsque vous connexions première fois
window.localStorage.setItem("username", "rahul");
window.localStorage.setItem("password", "123");
Vérifier Local de stockage des informations d'identification lorsque vous ouvre votre application prochaine fois .méthode run ().
Clair apps local de stockage lorsque vous fermez la session à partir de l'app
window.localStorage.removeItem("username", "rahul");
window.localStorage.removeItem("password", "123");
OriginalL'auteur Rahul Patil