如何使用passport-facebook身份验证重定向到用户登录react-redux应用程序的页面？

Posted 2023-03-08

【中文标题】如何使用passport-facebook身份验证重定向到用户登录react-redux应用程序的页面？

【英文标题】：How to redirect to the page from which the user logged in in react-redux app with passport-facebook authentication?

【发布时间】：2017-05-13 08:08:33

【问题描述】：

我有一个 react-redux 应用程序并使用 passport-facebook 进行身份验证。我希望用户能够从应用程序的任何页面登录，然后立即返回（重定向）到同一页面。实现这一目标的最佳做法是什么？

到目前为止，我已经提出了以下解决方案，但感觉不对。我创建了一个“虚拟” SuccessLogin 组件，并在成功登录后重定向到该组件。在“虚拟”组件中，我再次将用户重定向到之前的位置。

服务器端代码：

router.get '/facebook/callback', passport.authenticate('facebook',  successRedirect: '/success', failureRedirect: '/auth' )

我的“虚拟”组件如下所示：

class SuccessLogin extends React.Component

  componentDidMount: () ->
    @props.redirectBack()

  render: () ->
    null

redirectBack 是这样定义的：

redirectBack = () ->
  (dispatch, getState) ->
    dispatch go(-1)

go 是 React-Router-Redux 的动作创建者：https://github.com/reactjs/react-router-redux

我会遇到这个解决方案的任何问题吗？实现此逻辑的更好方法是什么？

【参考方案1】：

最后我找到了一个与 React-Redux 无关的解决方案。它的灵感来自这两个问题：Redirecting to previous page after authentication in node.js using passport.js 和 how to redirect to original page after successful authentication using passport-google-oauth。 服务器端代码：

setRedirect = (req, res, next) ->
  req.session.redirectTo = req.headers.referer
  next()

successRedirect = (req, res) ->
  destination = req.session.redirectTo || '/'
  res.redirect(destination)

router.get '/facebook', setRedirect, passport.authenticate('facebook',  scope: ['email'] )    
router.get '/facebook/callback', passport.authenticate('facebook',  failureRedirect: '/auth' ), successRedirect