web-dev-qa-db-fra.com

Quelle est la bonne façon de se connecter aux utilisateurs en utilisant Angular & Express?

Je suis en train de créer un site Web simple où j'aimerais permettre aux utilisateurs de se connecter à l'aide de Facebook, puis d'afficher une page avec des éléments personnalisés selon qu'ils sont connectés ou non. , mais si vous êtes connecté, il affiche d'autres informations en fonction de leurs informations utilisateur.

J'utilise le module Facebook passportjs, Express et Angular. Je crois que le passeport est correctement implémenté, mais je ne sais pas 1) comment vérifier si un utilisateur est connecté et 2) les meilleures pratiques pour afficher des vues basées sur l'état de l'utilisateur en utilisant Angular = & Express. J'ai regardé un exemple ici, mais ne pense pas que c'est ce que je devrais faire en utilisant Angular ( https://github.com/jaredhanson/passeport-facebook )

Merci!

angularjsexpresspassport.js
26
manihiki

Pour compléter la réponse @wpalahnuk, vous devez créer un service ou une usine pour traiter l'authentification et un httpInterceptor pour intercepter la réponse envoyée par le serveur pour savoir si l'utilisateur est connecté ou non (vérification du code staus 401).

Pour la partie Express, vous devez utiliser le module génial de nœud de passeport pour gérer l'authentification côté serveur.

Vous avez tous les détails ici: https://vickev.com/#!/article/authentication-in-single-page-applications-node-js-passportjs-angularjs

Cet article est vraiment génial, Brad Green (directeur de l'ingénierie chez Google pour AngularJS) m'annonce ce post.

J'espère que cela aide.

Si vous voulez en savoir plus sur la sécurité dans Angular vous avez juste à demander et je serai très heureux de vous aider.

51
Thomas Pons

Je n'utilise pas node.js et express, mais sécurise plutôt le social pour le jeu! cadre, mais je suppose que le processus est similaire.

Vous devez créer un service qui contacte le serveur pour le statut de connexion utilisateur, puis stocker cette variable. Vous pouvez ensuite injecter ce service dans chaque contrôleur qui doit être au courant ou modifier l'état de connexion de vos utilisateurs.

Ce blog est l'endroit d'où j'ai obtenu mon implémentation: http://blog.brunoscopelliti.com/deal-with-users-authentication-in-an-angularjs-web-app

Voici le service:

services.factory('UserService', [function() {
    var sdo = {
        isLogged: false,
        username: ''
    };
    return sdo;
}]);

Voici un exemple de connexion d'un utilisateur dans un contrôleur

var User = UserService
scope.login = function() {
    var config = { /* ... */ } // configuration object

    $http(config)
    .success(function(data, status, headers, config) {
        if (data.status) {
            // succefull login
            User.isLogged = true;
            User.username = data.username;
        }
        else {
            User.isLogged = false;
            User.username = '';
        }
    })
    .error(function(data, status, headers, config) {
        User.isLogged = false;
        User.username = '';
    });
}

Je vous recommande vraiment de lire l'article du blog car il couvre cela plus en détail et il y a quelques autres articles connexes

Vous pouvez ensuite utiliser la variable User.isLogged pour masquer ou afficher différents éléments et l'utiliser pour déterminer les itinéraires disponibles

4
wpalahnuk