JQuery Mobile - Connexion de l'utilisateur
Je suis en train de construire une interface mobile avec JQuery Mobile pour une application web qui nécessite l'authentification de l'utilisateur, et je ne peux pas trancher sur la meilleure approche pour la mise en œuvre d'un processus d'ouverture de session.
Je ne suis pas ainsi préoccupé par l'authentification côté serveur, mais plutôt comment la mettre en œuvre sur le côté utilisateur.
Après quelques tests, il semble que les options sont:
- Standard soumettre le formulaire avec POST\redirection:
-Désactiver automatique ajax avecdata-ajax="false"
L'utilisateur soumet, vérifiez les informations d'identification au serveur, puis d'envoyer une redirection à l'application de la réussite ou de retour à la page de connexion en cas d'échec. - Ajax méthode avec
$.mobile.changePage
-Envoyer le nom d'utilisateur/mot de passe via Ajax
-En fonction de la réponse, soit ajouter de la première page de l'app avec$.mobile.changePage
ou afficher un message d'erreur - Ajax méthode avec
window.location.replace
-Similaire à l'option 2, à l'exception de l'utilisationwindow.location.replace
à ajouter en première page de l'app - Ajax méthode POST; rediriger uniquement sur l'échec de la connexion
-Conserver à l'ajax pour les soumissions de formulaire.
-Sur le côté serveur, de combiner votre authentification de l'utilisateur de la fonction avec la page d'entrée de votre application, de telle sorte qu'il s'exécute uniquement si les champs du formulaire sont fixés.
-Sur la connexion réussie, le retour en première page de l'application.
-Sur l'échec de la connexion, redirection vers la page de connexion.
-Si les valeurs ne sont pas définies, vérifier si l'utilisateur est connecté correctement et ensuite de retour à la sortie standard de la page. Si pas connecté, redirection de connexion.
Quelques considérations:
-Il doit utiliser POST pour éviter de placer les données de connexion à l'URL
-Le maintien de corriger bouton de retour de la fonctionnalité, de sorte que la navigation est conviviale semble être le genre de difficile.
-Je tiens à rendre le flux de processus aussi facilement que possible avec aussi peu de page est actualisée que possible
Des idées?
EDIT:
J'ai trouvé un 4ème méthode, qui peut être la meilleure approche. Il évite le bouton retour des problèmes de fonctionnement résultant de la POSTE/méthode de redirection. Si l'utilisateur s'authentifie sur la première tentative, la lisse de transition de page est maintenue tout le temps. Si non, la transition de page flux sera maintenu en permanence après le succès de l'ouverture d'une session. En outre, toutes JQM intégré de gestion des erreurs caractéristiques restent disponibles.
source d'informationauteur user1091949
Vous devez vous connecter pour publier un commentaire.
Fondamentalement, c'est selon le besoin.
Standard soumettre le formulaire( Point 1) est très claire voie, mais si la connexion est échouébesoin de recharger la page, plusieurs demandes( l'un pour la connexion-case, un autre pour le chargement de la page) sont mis & aussi, besoin de remplir de retour des données d'entrée.
Certains avantages pour l'AJAX r-
Si la connexion est fermée ou une défaillance du réseau, nous pouvons faire preuve d'une erreur de garder le design de la page intact. Dans le cas de la norme soumettre - il affichera une erreur de connexion - dans quel point de l'utilisateur peut être nécessaire de redémarrer le mobile-app.
À l'avenir à utiliser, si nous avons la force de l'utilisateur de se connecter pour voir le contenu d'une page, AJAX pouvez simplement faire ce truc, rapidement. Nous pouvons donc mettre que le nom d'utilisateur-boîte tous-où & journal de l'utilisateur sans interrompre état actuel.
Je sais que cette question est de plus d'un an, mais voici mes deux cents.
Ce que j'ai fait est un JQuery Mobile de forme qui ressemble à:
Alors une fonction d'intercepter le bouton "Soumettre" cliquez sur:
Bien sûr, cela devrait aller sur HTTPS. Dans mon cas, je suis validant avec un serveur de côté service REST. Vous pouvez le faire revenir 403 si les informations sont erronées, par exemple. Ensuite, vous envoyez à l'aide de $.mobile.changePage() à une page dans le même DOM ou à une autre URL.