ReactJS和Django之间的安全身份验证

Question

一直在阅读和观看，并询问了很多关于ReactJS和Django的问题。

这特别有助于我理解从Django REST Framework到ReactJS以及从ReactJS到Django REST Framework的数据流。

Django Forms and Authentication with Front-end Framework (AngularJS/ReactJS)

但是，我想要了解的一件事是对Django REST Framework的身份验证。我从文档中了解到它内置了身份验证。由于这是敏感数据，我显然希望它只是通过转到http://www.my_site.com/info/api来保护人们检索它。

我需要将ReactJS设置为唯一可以从API请求数据的东西，无论是通过密钥还是用户名/密码凭据。我很好奇这是如何处理的？显然，我不想在ReactJS中使用硬编码，因为它将与ReactJS的其余部分一起编译。

Answer 1

以下是我接近它的方法：我使用JSON Web Token (JWT)进行身份验证和授权。

您使用后端来保护来自无效 JWT的 除之外的所有 API请求，以防止用户无法拥有的路由一个令牌（即注册/登录页面）。

以下是应用程序的流程：

1. 新用户使用电子邮件和密码等标准凭据注册到您的应用。
2. 您的后端将创建一个新用户，签署一个新的JWT令牌（通常使用用户的ID）。您可能会使用第三方库来签署/验证令牌（我没有Django社区的经验，但我确信快速的Google搜索会给您答案）。你的后端会发回这个令牌。这是后端唯一一次收到有关注册的电子邮件，密码或任何其他敏感信息。
3. 从这一点开始，React将仅使用此令牌进行授权。 React会将此令牌保存在某处（即localStorage），并将此令牌与请求的其他部分一起发送到您使用后端创建的API路由。您将在请求的authorization标头中发送此令牌。
4. 您的后端将使用第三方库验证此令牌。如果它无效，请求将停止，并返回未经授权的错误。如果它有效则请求继续。

这实现了以下目标：

1. 您的API路线受未经身份验证的用户保护
2. 针对授权用户验证了对API的每个请求，以保护任何人不会请求您的API的任何部分。
3. 您可以通过仅允许用户请求修改自己的数据来进一步巩固此功能。例如，保护Suzy的个人资料不会被其他人修改，只允许她的ID使用她的ID来修改她的帐户/数据。

重要提示 - 您的后端永远不会将这些令牌保存在存储中。它将验证每个请求上的令牌。详细了解JSON Web Tokens (JWT)及其工作原理。

Answer 2

Django Rest Framework内置了token authentication和JWT Token Auth的第三方软件包。

如果您可以使用标准令牌身份验证，那么使用drf-redux-auth可能会非常简单。如果您出于某种原因需要JWT，例如上述Keith的suggested，则可以轻松地进行上述操作……