使用Redux验证用户的流程

Question

什么是Redux组织客户端用户身份验证代码的方法？

也很想学习如何最好地将Facebook登录到Redux中.

Answer 1

我没有使用 Facebook 的登录流程，但我认为这是同样的想法。

\n\n

因此，要登录并存储数据，只需为用户创建具有以下字段的附加减速器：

\n\n

{\n   access_token: null,\n   isLogin: false,\n   isProcessingLogin: true,\n   profile: {}\n}\n

\n\n

当然，您可以有更多字段，您也可以在此处放置注册信息（例如，isUserRegistering或details，等等）。

\n\n

您必须执行的所有操作 \xe2\x80\x93 创建像logIn和logOut这样的方法，这将执行此流程。在其中，只需更改相应的字段即可更新您的 UI，以添加加载、错误处理等。

\n\n

类似于下面的代码：

\n\n

    // action creator\n    const logIn = (params) => {\n      return dispatch => {\n         dispatch({ type: 'PROCESSING_LOGIN' });\n         makeAPICall(params)\n            .then(\n                res => dispatch({ type: 'SUCCESS_LOGIN', payload: res }),\n                err => dispatch({ type: 'FAIL_LOGIN', payload: err })\n            );\n      };\n    };\n\n    // reducer\n    ['PROCESSING_LOGIN'](state) => {\n        return Object.assign({}, state, {\n           isProcessingLogin: true\n        });\n    },\n    [SUCCESS_LOGIN](state, action) => {\n        return Object.assign({}, state, {\n            isLogin: true,\n            isProcessingLogin: false,\n            access_token: action.payload.meta.access_token\n        });\n    }\n

\n\n

我不得不提的是，构建中间件来始终附加令牌可能不是一个好主意，如果您的请求必须在减速器内部区分，无论它们是否带有令牌 \xe2\x80\x93 所以，它可能会更灵活一点自己添加token。

\n