Angularjs 节点API-如何将Facebook登录链接到前端？

把这个问题改写得更清楚些

我使用passport facebook在我的网站上处理facebook登录

我的前端是角度的，所以我知道现在需要了解调用api路由的正确方式。我已经使用Angular的

$http

服务打了好几个电话-但是，当使用facebook登录时，实际上会重新路由facebook页面，我仍然可以使用通常的方式：

self.loginFacebook = function )() {
        var deferred = $q.defer();
            var theReq = {
             method: 'GET',
             url: API + '/login/facebook'
            };

            $http(theReq)
            .then(function(data){
              deferred.resolve(data);
            })

            return deferred.promise;
}

或者在窗口位置直接点击该URL完全可以/安全/正确的过程：

self.loginFacebook = function (){
    $window.location.href = API + '/login/facebook';
}

此外，如何从这个API发送令牌？我似乎无法修改回调函数来实现这一点

router.get('/login/facebook/callback',
   passport.authenticate('facebook', {
      successRedirect : 'http://localhost:3000/#/',
      failureRedirect : 'http://localhost:3000/#/login'
   })
);

---

谢谢。

根据您的前端，您将需要一些实际调用节点/express API的逻辑。您的HTML元素可能看起来像

 <a class='btn' href='login/facebook'>Login</a>

---

单击此元素将使用/login/facebook的端点调用您的Express路由器。这很简单。

我被困在同一个问题上

第一部分：

  <a href="/api/auth/facebook" target="_self" class=""><span class="fa fa-facebook"></span> Login with facebook</a>

我允许在后端使用cors，在前端使用$httpProvider，如下所示：

angular.module('core', [
    'ui.router',
    'user'
    ]).config(config);

    function config($httpProvider) {
        $httpProvider.defaults.useXDomain = true;
        $httpProvider.defaults.headers.common['X-Requested-With'];
        $httpProvider.defaults.headers.common["X-Requested-With"] = 'XMLHttpRequest';
    };

router.get('/facebook', passport.authenticate('facebook', 
    { session: false, scope : 'email' }));

// handle the callback after facebook has authenticated the user
router.get('/facebook/callback',
    passport.authenticate('facebook', 
        {session: false, failureRedirect: '/error' }), 
            function(req, res, next) {
                var token = jwt.encode(req.user.facebook, config.secret);
                res.redirect("/fb/"+token);
});

callbackURL: "http://yourdomain.com/api/auth/facebook/callback"

第二部分：

  <a href="/api/auth/facebook" target="_self" class=""><span class="fa fa-facebook"></span> Login with facebook</a>

在前端，我使用状态捕获/fb/：令牌并将令牌分配给本地存储，然后每次用户转到私有部分时，令牌都会被发送到后端并进行验证，如果验证通过，则验证函数将返回带有解码数据的令牌

唯一不好的是，我不知道如何重定向到用户单击facebook登录时的前一个状态

另外，我不知道你是如何使用回调的，但你需要有域名才能允许从facebook重定向。我在digitalocean中创建了一个服务器水滴来测试facebook的策略。 在该策略中，您必须将实际域放入回调函数中，如下所示：

angular.module('core', [
    'ui.router',
    'user'
    ]).config(config);

    function config($httpProvider) {
        $httpProvider.defaults.useXDomain = true;
        $httpProvider.defaults.headers.common['X-Requested-With'];
        $httpProvider.defaults.headers.common["X-Requested-With"] = 'XMLHttpRequest';
    };

router.get('/facebook', passport.authenticate('facebook', 
    { session: false, scope : 'email' }));

// handle the callback after facebook has authenticated the user
router.get('/facebook/callback',
    passport.authenticate('facebook', 
        {session: false, failureRedirect: '/error' }), 
            function(req, res, next) {
                var token = jwt.encode(req.user.facebook, config.secret);
                res.redirect("/fb/"+token);
});

callbackURL: "http://yourdomain.com/api/auth/facebook/callback"

在同一个对象中，您将secretId和clientSecret放在同一个对象中。然后，在facebook开发者的应用程序中，您必须允许此域

---

对不起，我的英语，我希望这个信息能帮助你。

所以我有类似

var-theReq={method'GET'，url:API+'/login/facebook'}但这当然会导致CORS问题？这就是你的意思吗？如果你从你所有的角度HTTP请求到你的API都收到了CORS问题，那么这里就有一个更大的问题——一个独立于passport的问题。不，我只是为那个问题收到它。我认为这仅仅是因为我的测试API在localhost:2000上，而我的站点在localhost:3000上。这可能就是问题所在。我想提出几件事中的一件。1） 将它们放在同一端口上。2） 为Express设置CORS中间件包。3） 实现一个代理，将所有请求路由到正确的位置。好吧，让我试试，但是我的实际通用架构对此有效。关于API调用facebook URL，我的客户端只是通过$http访问该API路由？？