Comment s’authentifier en Ionic avec Spring Security

ionic

Comment s’authentifier en Ionic avec Spring Security

Générer une nouvelle application Ionic

 

 

Si Ionic n’est pas installé sur votre machine, exécutez cette commande pour installer Ionic npm install -g cordova ionic.

 

Le flag –-lab est tout à fait nouveau et indique l’apparence de votre application sur iOS et Android. Des trucs épiques que les développeurs d’ionic créent!

 

Modifier la template

 

Comme nous voulons afficher notre page de connexion avant les onglets que vous voyez maintenant, nous devons ajouter un nouveau fichier dans le dossier www / templates, nommé login.html avec ce contenu: www/templates/login.html

 

 

Pour l’instant, ajoutons notre itinéraire afin que nous puissions voir notre vue la première fois.

Par conséquent, ouvrez le fichier app.js et ajoutez cet état aux états déjà existants:

 

 

Comme nous voulons afficher notre page de profil avant les onglets que vous voyez actuellement, nous devons ajouter un nouveau fichier dans le dossier www / templates, nommé profile.html, avec ce contenu: www/templates/profile.html

 

 

Pour l’instant, ajoutons notre itinéraire afin que nous puissions voir notre vue la première fois. Par conséquent, ouvrez le fichier app.js et ajoutez cet état aux états déjà existants:

 

 

Comme nous voulons afficher notre page de périphérique avant les onglets que vous voyez maintenant, nous devons ajouter un nouveau fichier dans le dossier www / templates, nommé device.html avec ce contenu: www/templates/device.html

 

 

Afin de créer des objets ou des fonctions uniques, AngularJS prend en charge les concepts utilisant l’architecture de services.

 

Ces services peuvent être utilisés dans n’importe quel contrôleur en les déclarant simplement comme des dépendances. 

 

www/js/services.js

 

 

Ouvrez maintenant le fichier controllers.js, ajoutez notre simple login, profil et device controller et injectez LoginService dans le LoginController.

 

www/js/controllers.js

 

 

www/js/constants.js

 

 

www/index.html

 

 

Exécuter l’application serveur

 

Téléchargez le code source du serveur (labo 1) à partir de ce lien:

 

https://bitbucket.org/intellitech-team/spring-labs/src/da6f67a63d9be72c51a38e516350815ac456e404/Lab1/?at=master

 

Créez une base de données avec le nom springlabs et exécutez le script dans la base de données PostgreSQL:

 

 

Maintenant, exécutez l’application à l’aide de la commande mvn spring-boot: exécutez puis visitez localhost: 8080 et authentifiez-vous auprès de l’un des deux utilisateurs suivant :

 

USER1: username=user, password=user
USER2: username=admin, password=admin

 

Exécuter l’application mobile

 

Téléchargez le code source Ionic à partir de bitbucket 

https://bitbucket.org/intellitech-team/spring-labs/src/da6f67a63d9be72c51a38e516350815ac456e404/Lab2(IONIC)/?at=master

et exécutez la commande suivante

 

Avatar for Nizar Ellouze

Author: Nizar Ellouze

No Comments

Post a Comment

Comment
Name
Email
Website