我正在使用React创建一个带有一组微服务和前端的新应用程序。我有自己的使用Oauth的auth服务器。理想情况下，我希望在React应用程序中保留用户登录和注册过程，因为我拥有auth服务器和客户端应用程序。
我想使用密码授权但由于React是单页应用程序，我无法保护秘密。我可以使用隐式授权，但实际上并不想将用户重定向到另一个页面进行登录或注册。这对于未来的第三方集成是可以的，但是由于我拥有前端，我希望尽可能地使其无缝（例如像Facebook）。
作为替代方案，我可以创建一个用户微服务（我可以保护秘密），提供用于登录和注册的API，然后使用密码授权调用auth服务吗？
答案 0 :(得分：1)
您在这里有两个问题。
一个是如何在不泄漏client_ secret的情况下对SPA进行身份验证，另一个是在解决第一个问题后如何将访问令牌安全地存储在前端中。
我会推荐这种方法
创建在与SPA相同的域名上运行的后端代理-仍可以是您的身份验证后端。
然后，您可以将SPA中的凭据发布到此代理后端，以使用密码授予功能对用户进行身份验证。
身份验证后，您可以通过安全的http cookie将access_token（或基于常规会话的身份验证）返回给客户端，这将使您的SPA API请求通过该cookie进行身份验证。
这将带来另一个您需要注意的问题。 CSRF-您可以生成CSRF令牌，并通过普通的XSRF-TOKEN Cookie将其发送到客户端，该Cookie会被您的http客户端（如轴）自动选择，并通过X-XSRF-TOKEN标头返回给服务器。 >
在代理中收到csrf令牌后，您可以将其与Cookie上的令牌或会话中的令牌进行比较，然后再继续请求。
要查看的其他内容将是保护CORS标头并确保服务器仅接受来自SPA域名的请求。
答案 1 :(得分：0)
我相信你想拥有的是＆＃34; Resource Owner Password Credentials Grant＆＃34;。在此Oauth 2流程中，最终用户（资源所有者）向客户端提供其凭据，信任客户端。客户端使用这些凭据从授权服务器交换令牌。您的前端不应存储凭据。但与往常一样，它需要存储令牌。
一旦前端获得令牌，它就可以与您拥有的服务器通信。它们必须受到令牌的保护，您可以根据授权服务器进行验证。
答案 2 :(得分：0)
我猜秘密你的意思是客户秘密？
由于React是javascript，你不能保护客户端秘密，你不想使用隐式授权，拥有服务/微服务作为UI后端是一个很好的方法。 UI后端可以保护客户端密钥并使用您的OAuth服务器创建令牌。然后UI前端将调用UI后端API。 UI后端可以使用password授权类型在用户登录时创建令牌。
答案 3 :(得分：0)