【问题标题】:how to handle passport-facebook callback in angular client?如何在 Angular 客户端中处理 passport-facebook 回调?
【发布时间】:2016-04-17 05:08:01
【问题描述】:

我正在开发一个 MEAN 应用程序。我正在使用护照进行身份验证——本地、Facebook 和谷歌策略。

我正在使用 angularjs 客户端。所有路由都在客户端处理。我只使用服务器数据 api。

当使用 passport-facebook 策略时,我根据护照文档在节点服务器上使用以下代码。

    app.get('/auth/facebook',passport.authenticate('facebook-auth', { scope : ['email'] }));
    app.get('/auth/facebook/callback',passport.authenticate('facebook-auth', {
        successRedirect : '/home',
        failureRedirect : '/login',
        scope:['email']
    }));

我面临的问题是当用户点击“使用 Facebook 登录”按钮时

<a href="/auth/facebook" class="btn"><i class="fa fa-facebook"></i> Sign in using Facebook</a>

客户端将访问“/auth/facebook”路由,该路由最终会将用户重定向到 facebook 页面以验证用户的凭据。

验证成功后,用户将被重定向到“successRedirect”值中定义的路由“/home”。

现在问题是,我想使用自定义回调函数,而不是为成功或失败定义重定向。如下所示:

app.get('/auth/facebook/callback',passport.authenticate('facebook-auth', function(err,user,info){
   if(err){
            throw err;
        }
        else if(user === 'userexists'){
            res.json({
                'state':false,
                'message':'User with this e-mail already exists'
            });
        }
        else{
            req.logIn(user,function(loginErr){
                if(loginErr){
                    throw loginErr;
                }
                res.json({
                    'state':true,
                    'message':'You logged in successfully!'
                });
            });
        }
 }));

我在这里面临的根本问题,我不能使用上面的自定义回调,因为客户端没有调用“auth/facebook/callback”路由,它是由 facebook 调用的。 所以,没有成功处理程序等待在客户端捕获上述回调的响应!

我想要某种方式在客户端以 json 形式获得响应,以消除服务器端重定向,以及在通过 facebook 成功验证后将消息和用户名传递给客户端的方式。

我即将放弃护照。在删除大量代码之前希望有任何可能的解决方案!

谢谢

【问题讨论】:

    标签: angularjs node.js passport.js passport-facebook


    【解决方案1】:

    这可以通过重定向到 facebook 回调处理程序中的另一个端点来完成。无需在来自 facebook 的回调上执行 res.json(),因为他们只向该回调发出请求,以便让您知道身份验证是否失败或成功。 From their docs:

    // GET /auth/facebook/callback
    //   Use passport.authenticate() as route middleware to authenticate the
    //   request.  If authentication fails, the user will be redirected back to the
    //   login page.  Otherwise, the primary route function function will be called,
    //   which, in this example, will redirect the user to the home page.
    

    因此,当 facebook 调用 /auth/fb/callback 时,Facebook 会将请求过程的控制权交还给您,但接下来要做什么取决于您。因为一旦用户成功通过身份验证,您将在整个会话期间使用req.user。此时,您可以重定向到示例 /account 中的类似内容,并检查 req.user 是否与 req.isAuthenticated() 并完成您想要的流程。

    【讨论】:

    • @Designeer,不客气。发回以防您发现更多问题:D
    • @onel0p3z 我在 reactjs 而不是 angular 中做同样的事情。我的服务器在 Node 上,我正在使用 express。我已经在我的服务器端成功实现了 passport-facebook。现在我通过锚标签从反应中调用'/auth/facebook'。但我不知道如何在反应中取回响应,因为它仅由服务器处理,我不想通过服务器上的 response.redirect 处理它。你能建议如何处理这种情况吗?
    • @Vijay 我认为最好为这个问题创建一个条目,但同时我认为你可以使用模态/灯箱来执行此身份验证流程,但老实说我没有太多reactjs的经验。希望这会有所帮助!
    猜你喜欢
    • 2012-04-17
    • 2023-03-10
    • 2022-07-04
    • 1970-01-01
    • 1970-01-01
    • 2019-07-26
    • 2014-02-02
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多