Angular 如何使用Spring Boot处理外部OAuth2身份验证&x2B；有棱角的

我有一个Spring Boot应用程序作为后端和一个Angular 6前端。它们各自工作得很好，我把它们作为一个起点。现在，我要使用外部OAuth对我的用户进行身份验证，以访问他们的一些WoW角色数据

关于如何使用OAuth限制对后端的访问，我有一个不错的想法，因为SpringSecurity使这变得非常容易。我正在努力解决的问题是，如果我的用户经过身份验证+授权可以访问角色A，我如何在前端和后端处理这个问题

---

由于Angular正在处理HTML页面的路由，而这些HTML页面调用我的后端，因此我不确定如何将授权扩展到Angular。我可以展示代码，但我认为这更多的是一个概念问题，而不是代码问题。

您需要给前端代码一些OAuth的爱。这是一个很好的图书馆（我用它），但我用它

现在，答案很长：

OAuth规范定义了几个不同的“流”，客户端应用程序通常使用的是隐式流。这意味着，如果你想成为普通人，你需要自己实现，你需要做如下的事情：

页面加载：检查URL状态。如果找到令牌和数据，请将其存储在sessionStorage中

如果URL中没有令牌，请检查会话存储中的令牌

每次对后端的HTTP请求，都会在头中附加accessToken

对于登录/注销，您需要使用特制的URL和参数将用户重定向到OAuth服务器

现在，更详细的回答是：

在页面加载时，检查会话存储中是否有一些状态。比如，保存的

accessToken

之类的东西。（不完全正确，但请继续阅读）

如果是，您可能希望在OAuth服务器上验证该令牌（有时您还需要将过期时间戳保存在存储器中，您也可以检查该时间戳）

在任何对后端的Http请求中，您将此令牌（

accessToken

或有时

id\u令牌

，或者它可能是jwt、承载器，不管什么，我们只说令牌）附加到每个请求的头中。通常它类似于

Authentication

头，值为

Bearer${token}

。

• 后端现在可以检查此令牌，如果有效，则返回您的数据，如果无效或丢失，则返回401。（它也可以重定向到身份验证服务器，但请不要这样做）

如果页面加载上没有令牌，您可以向用户指示这一点。比如，让他们登录

此登录按钮将用户重定向到OAuth登录页面。它们会从你的页面上消失。这是一个精心编制的URL，提供您的应用程序数据，如

http://server/auth/your-app-name?clientId=your-客户端id和重定向URL=http://your-angular-page/where-you-wanna-land

。这到底是什么样子，取决于不同的服务器、不同的实现。

• 现在，用户登录到他们的登录页面，给出他的用户名/密码/权限等（或者，如果他们已经登录了，mgiht立即重定向回）。在他们登录并授予您的应用程序权限后，身份验证服务器将用户重定向回

现在您回到了步骤1。但是，您首先要检查URL，而不是检查会话存储。 因为url看起来像：

http://your-angular-page/your-route?accessToken=&...

和其他类似的东西。现在您读取accessToken并将其存储在本地，就完成了

---

您计划使用哪种OAuth提供程序？如果有的话，您正在使用哪个OAuth库？你有JWT还是只有裸币？您计划使用哪个OAuth流？使用其中一个概念并不是什么大问题，但这取决于你的细节。我基本上只是在验证暴雪的OAuth。我没有从棱角的一侧挑出任何东西，所以我想这就是我要问的。。。我需要一个单独的OAuth库用于Angular和Spring吗？是的，当然。Angular不知道弹簧是什么：）无论如何。我可以试着举个例子，等待答案。哇！这很有帮助。我会给所有这些信息一次机会，谢谢！！我有一个简短的问题@Zlatko，Battle.Net/Blizzard OAuth API返回一个身份验证代码。这是我用来在前端/后端之间传递的代码吗？嗯，这取决于它们使用什么-可能这就是您需要的访问令牌。或者，代码现在用于获取实际令牌。别问了，我知道这很复杂。这就是为什么最好使用像我链接的库这样的东西，为你处理所有的垃圾。所以它实际上看起来有点混乱。似乎angular-oauth2-oidc库。由于客户端ID和秘密共享，暴雪也在客户端上运行。但是，现在我不知道服务器将如何告诉客户机显示Battle.Net登录页面，如果服务器调用OAuth API？nono，则lib支持隐式流。在这里，您只需将用户重新指定为blizard进行身份验证，然后获取一个令牌。