Authentification dans une application Ionic/Cordova

Question

Tout d'abord, je ne suis pas un pro.

Dans ma quête pour devenir un meilleur développeur, j'essaie de comprendre ce qui est nécessaire et comment accomplir la création d'une inscription/login pour une application Ionic-Framework.

La plupart des applications à page unique (SPA) gèrent l'authentification sur un serveur de nœuds qui sert également le HTML pour le client. Dans mon cas, c'est le téléphone lui-même qui servira le HTML, et je suppose donc que je risque de me heurter à des problèmes de COR.

Je comprends que le Ionic-Framework utilise des états et se base sur angular-client-side-auth Je devrais m'authentifier à chaque fois que je change d'état dans mon application.

J'ai configuré une première application, mais je ne sais plus où donner de la tête.

Les outils que j'ai à ma disposition :

• Serveur Node.JS - Merci DigitalOcean (Devrais-je l'utiliser comme un proxy vers ma base de données ?)
• Serveur CouchDB (Full stack, nous voilà)

Mes questions :

1. Quelle est l'approche standard pour l'authentification lors de l'utilisation d'applications hybrides ?
2. Devrais-je utiliser Node.JS comme proxy vers la base de données ?
3. Devrais-je ignorer node.js et m'authentifier directement auprès du serveur CouchDB ? (J'ai entendu parler de cela)
4. Est-ce que je m'y prends de la mauvaise façon ?
5. Quels sont mes obstacles potentiels ?
6. Comment le CORS fonctionne-t-il avec les applications hybrides ?
7. Il y a quelque chose que j'ai manqué ?

Merci de m'avoir aidé à devenir un meilleur développeur.

Answer 1

Ok, il y a beaucoup de réponses. Mais la réponse courte est de de garder les choses simples et de s'authentifier comme vous le feriez pour une application web normale.

Dans une application web ordinaire :

• Dans une application web classique, vous enverriez une requête à un serveur et vérifieriez les informations d'identification dans une base de données pour authentifier l'utilisateur.

Dans une application mobile :

• Dans une application mobile, vous ferez la même chose via des requêtes ajax (en utilisant $http dans le cas d'angular).
• Une fois l'authentification terminée, le serveur renvoie une réponse à l'application (par exemple, json/xml) indiquant au frontal le résultat de l'authentification.

Quelle est l'approche standard ?

• Je ne suis pas sûr de la norme, mais cela semble être l'approche la plus simple. Les normes changent toujours parce qu'il y a toujours une meilleure façon de faire. Donc, tant que cela permet de faire le travail, allez-y, améliorez-le plus tard.

Devrais-je utiliser Node.JS comme proxy vers la base de données ?

• Je n'ai pas beaucoup utilisé nodeJs, donc je ne sais pas ce que vous voulez dire. Mais si cela peut vous aider, j'utilise php sur le serveur qui reçoit la requête ajax, gère l'authentification avec la base de données mysql et renvoie la réponse à l'application mobile.

Est-ce que je m'y prends de la mauvaise façon ?

• Je n'ai pas vu votre configuration initiale. Pour ce qui est de l'authentification lorsque vous changez d'état dans l'application, vous pouvez utiliser localStorage pour stocker les informations de l'utilisateur après une connexion réussie. Lors de la déconnexion, effacez le localStorage. Ainsi, tout ce que vous devez faire est de vérifier si la valeur existe dans le localStorage pour confirmer que l'utilisateur est connecté.

Quels sont mes obstacles potentiels ?

• Je vous suggère de commencer à créer votre application et vous le saurez bien assez tôt. Dans l'ensemble, ionic+cordova rend les choses assez simples et supprime la plupart des obstacles au développement d'applications.

Comment le CORS fonctionne-t-il avec les applications hybrides ?

• Cordova autorise les requêtes interdomaines par défaut. Vous n'aurez donc aucun problème avec les requêtes interdomaines et vous pourrez ainsi accéder directement à votre serveur pour l'authentification.

Il y a quelque chose que j'ai manqué ?

• IonicFramework est juste un cadre HTML5 frontal. Il ne peut pas à lui seul vous permettre de créer une application mobile, mais seulement de vous fournir une interface utilisateur agréable avec laquelle travailler. IonicFramework vous fournit de jolies fonctionnalités de javascript qu'il met en œuvre en utilisant angular. Ainsi, pour tirer le meilleur parti de ionic, vous devez maîtriser angularJs. L'apprentissage d'Angular en vaut la peine, alors n'hésitez pas.

• L'application proprement dite est compilée par Cordova. Cordova prend vos fichiers html/css/javascript habituels et les package dans l'apk Android ou l'ipa iphone afin qu'ils puissent être installés sur sur les systèmes d'exploitation respectifs en tant qu'applications natives.

• Cordova est ce qui vous permettra d'accéder aux fonctions natives du téléphone comme l'appareil photo, la galerie, les contacts etc.

Answer 2

Nathvarun a donné une réponse très complète, mais j'aimerais partager les étapes que je fais pour l'authentification dans mon application.

1. Envoyer email + password via ajax vers le serveur
2. Générer un token dans le serveur et le renvoyer à l'application
3. Magasin email + token sur localStorage
4. Pour chaque requête que je fais au serveur, j'envoie email + token via POST
5. Dans le serveur je vérifie l'authenticité de cet utilisateur avec ce jeton, si true la méthode est exécutée, si false Je renvoie à l'application une erreur (401)
6. Si l'application reçoit un succès, alors c'est ok, si elle reçoit une erreur, je redirige vers l'écran de connexion.

Ce qui est bien, c'est que lorsque l'application est ouverte, vous pouvez obtenir les informations suivantes email + token de localStorage Si le jeton est correct pour cet utilisateur, il est redirigé vers l'écran principal, sinon il est redirigé vers le login. Ensuite, chaque fois que l'utilisateur vide le cache de l'application, il est redirigé vers l'écran de connexion.

Answer 3

J'avais en fait besoin de quelque chose comme ça pour quelques applications sur lesquelles je travaille. J'ai passé pas mal de temps à étudier la question et j'ai pu y parvenir.

Je suis assez satisfait du résultat. En plus de l'authentification par courriel/mot de passe, j'ai ajouté une authentification sociale qui fonctionne de la même manière.

1. ouvrir l'url du côté client avec l'url du fournisseur (facebook/twitter/instagram) pour la connexion
2. l'utilisateur se connecte et est redirigé vers l'url de rappel du serveur (mon serveur est écrit en nodejs)
3. une fois que j'ai obtenu le jeton d'accès du fournisseur. Je sauvegarde ce jeton et je crée ensuite un jeton pour le client afin de le réutiliser chaque fois que l'utilisateur veut accéder à une ressource protégée.

Télécharger le apk et le tester.

Si c'est ce que vous recherchez, vous pouvez consulter le code côté client à l'adresse : https://github.com/malikov/Authenticate.me-client-cordova-ionic

Et le code côté serveur à : https://github.com/malikov/Authenticate.me-Node-Server