使用 Passport 的 Express 服务器、ReactJS 和中继应用程序的身份验证策略
Authentication strategy for Express server, ReactJS and Relay application using Passport
在构建我的 ReactJS 应用程序几周后，是时候向它添加身份验证了。这让我很困惑。
我的应用程序由以下部分组成：
- 一个 Express 服务器，它 运行 在 mongoose/MongoDB 端口 3001 上是一个 GraphQL 服务器。
- 带有 React Router V4 的客户端 ReactJS + 中继应用程序，运行在端口 3000 上运行。
我有一个同时启动服务器和客户端 (npm start) 的脚本，这使它一切正常。服务器已加载，客户端已加载，浏览器在端口 3000 上打开并在端口 3001 上使用服务器上的 RelayJs 请求 GraphQL 数据。一切正常。
我过去曾使用 LocalStrategy 使用 Passport 身份验证。 Passport 进入数据库，检查用户名和密码，并使用 express 中间件中的路由器让请求继续进行。工作正常，但是 - 在服务器端 - 而不是在客户端。
我的目标是让用户启动客户端应用程序（今天将浏览器指向端口 3000）并且他们：
如果未授权，将被重定向到登录页面。
如果通过身份验证，用户将被重定向到应用程序。
使用 'remember me' 用户可能会在不登录的情况下返回到应用程序（在同一浏览器中一段时间 - 一整天）。
如果用户不记得username/password，要求重新设置，新的凭据将通过电子邮件发送。
目前我还看不出这些东西如何协同工作。服务器上的 Passport 运行s，所有逻辑都在客户端完成（除了在 MongoDB 上收集用户信息）。
我可以看到两种方法：
a) 构建一个专门处理端口 3000 上的身份验证的代理服务器。如果通过身份验证，它将代理到真正的 ReactJS 应用程序，该应用程序将 运行ning 在另一个内部端口上。但是这样做，我无法找出用户在第一次访问端口 3000 时将如何获取用于登录的应用程序。为此，我还必须更改我的客户端，因为它是用 webpack-dev 弹出的 create-react-app -服务器嵌入（事实上，在弹出后我不太明白客户端脚本中发生了什么）。简而言之 - 令人困惑，需要更改我的架构。
b) 将 Passport 添加到我的 ReactJS 应用程序。这将不起作用，因为密码在节点（服务器端）上构建为 运行。我不知道这是否可行或如何实现。
在这些 "not clear and confusing" 架构之后，我不知道该做什么。
你可以这样做：
- 在 express 中创建用于登录的路由
- 在该路由上使用护照中间件
- 在 React 中创建登录表单
- 通过 POST 将表单凭据数据发送到该快速登录路由
- passport 验证用户名和密码正确后，它会向您发回一切正常，您可以将用户发送到您的应用程序。
发什么快递取决于你想在客户端使用什么。可以是cookie，token（JWT）...
这样你就可以在没有 graphql 的情况下在 graphql 之前处理 Auth（API 在 /graphql 上，登录在 /login 上）
我使用类似的设置，如果您需要，我可以为您提供更多信息 ;)
在构建我的 ReactJS 应用程序几周后，是时候向它添加身份验证了。这让我很困惑。
我的应用程序由以下部分组成：
- 一个 Express 服务器，它 运行 在 mongoose/MongoDB 端口 3001 上是一个 GraphQL 服务器。
- 带有 React Router V4 的客户端 ReactJS + 中继应用程序，运行在端口 3000 上运行。
我有一个同时启动服务器和客户端 (npm start) 的脚本，这使它一切正常。服务器已加载，客户端已加载，浏览器在端口 3000 上打开并在端口 3001 上使用服务器上的 RelayJs 请求 GraphQL 数据。一切正常。
我过去曾使用 LocalStrategy 使用 Passport 身份验证。 Passport 进入数据库，检查用户名和密码，并使用 express 中间件中的路由器让请求继续进行。工作正常，但是 - 在服务器端 - 而不是在客户端。
我的目标是让用户启动客户端应用程序（今天将浏览器指向端口 3000）并且他们：
如果未授权，将被重定向到登录页面。
如果通过身份验证，用户将被重定向到应用程序。
使用 'remember me' 用户可能会在不登录的情况下返回到应用程序（在同一浏览器中一段时间 - 一整天）。
如果用户不记得username/password，要求重新设置，新的凭据将通过电子邮件发送。
目前我还看不出这些东西如何协同工作。服务器上的 Passport 运行s，所有逻辑都在客户端完成（除了在 MongoDB 上收集用户信息）。
我可以看到两种方法：
a) 构建一个专门处理端口 3000 上的身份验证的代理服务器。如果通过身份验证，它将代理到真正的 ReactJS 应用程序，该应用程序将 运行ning 在另一个内部端口上。但是这样做，我无法找出用户在第一次访问端口 3000 时将如何获取用于登录的应用程序。为此，我还必须更改我的客户端，因为它是用 webpack-dev 弹出的 create-react-app -服务器嵌入（事实上，在弹出后我不太明白客户端脚本中发生了什么）。简而言之 - 令人困惑，需要更改我的架构。
b) 将 Passport 添加到我的 ReactJS 应用程序。这将不起作用，因为密码在节点（服务器端）上构建为 运行。我不知道这是否可行或如何实现。
在这些 "not clear and confusing" 架构之后，我不知道该做什么。
你可以这样做：
- 在 express 中创建用于登录的路由
- 在该路由上使用护照中间件
- 在 React 中创建登录表单
- 通过 POST 将表单凭据数据发送到该快速登录路由
- passport 验证用户名和密码正确后，它会向您发回一切正常，您可以将用户发送到您的应用程序。
发什么快递取决于你想在客户端使用什么。可以是cookie，token（JWT）...
这样你就可以在没有 graphql 的情况下在 graphql 之前处理 Auth（API 在 /graphql 上，登录在 /login 上）
我使用类似的设置，如果您需要，我可以为您提供更多信息 ;)