前端OAuth认证成功后如何与后端交互？
How to interact with back-end after successful auth with OAuth on front-end?
我想构建小型应用程序。会有一些用户。我不想制作自己的用户系统。我想将我的应用程序与 oauth/oauth2.0.
集成
我的前端应用和oauth 2.0集成没有问题。有很多有用的文章，如何做到这一点，甚至 whosebug.com。例如 this post 很有帮助。
但是。前端授权成功后怎么办？当然，我可以只在客户端上设置标志，上面写着 "okay, mate, user is authenticated"，但我现在应该如何与后端交互？我不能只提出一些要求。后端 - 一些应用程序，它提供 API 功能。每个人都可以访问此 api.
所以，我的 FE 和 BE 之间无论如何都需要一些身份验证系统。这个系统应该如何运作？
ps 我的英语有些问题，可能我不能正确 'ask google' 。请你提供正确的问题:) 或者至少提供一些关于我的问题的文章。
UPD
我正在寻找概念。我不想为我当前的问题找到一些解决方案。我不认为我使用哪个 FE 和 BE 很重要（无论如何我会
请在下方提供相关信息）
FE 和 BE 将使用 JSON 进行通信。 FE 会发出请求，BE 会发送 JSON 响应。我的应用程序将具有以下结构（可能）：
- 前端 - 可能 AngularJS
- 后端-可能Laravel（laravel会实现逻辑，结构上还有数据库）
也许 "service provider" 像 google.com、vk.com、twitter.com 等会记住用户的状态？在FE上认证成功后，我可以直接从BE询问用户状态吗？
好吧，您的前端不需要 User-System。
前端只是一种与您的服务器交互并通过有效用户和密码请求令牌的方式。
您的服务器应该管理用户和权限。
用户登录场景
用户通过输入用户名和密码请求令牌。
server-API 接受请求，因为它是匿名方法（每个人都可以调用此方法而不用关心他是否登录。
服务器检查数据库（或一些存储）并将用户详细信息与他拥有的详细信息进行比较。
如果详细信息匹配，服务器将 return 令牌给用户。
从现在开始，用户应在任何请求中设置此令牌，以便服务器识别用户。
令牌实际上包含用户角色、时间戳等...
当用户通过 API 请求数据时，它从 header 获取用户令牌，并检查是否允许用户访问该方法。
通常情况下就是这样。
我的回答基于 .NET。但是大多数 BE libaries 都是这样工作的。
我正在为 SSO 做一个项目，根据我对你的问题的理解，我可以建议你在你的后端创建一个端点来生成会话，一旦客户端 - 前端 - 已成功获得授权由帐户所有者，并从提供者处获得用户信息，您 post 将该信息发送到后端端点，后端端点生成一个会话并存储该信息，并经常发回会话 ID名为 jSessionId- 带有一个 cookie 返回客户端 -frontend- 因此浏览器可以为您保存它，之后每个请求到后端都被视为经过身份验证的用户。
要注销，只需在后端创建另一个端点以接受会话 ID，以便后端可以将其删除。
希望对您有所帮助。
让我们从OAuth的概念开始，FE这里是Client，BE这里是Resource Server.
- 由于您的客户端已经授权，授权服务器应该授予
访问令牌到客户端。
- 客户端使用访问令牌
向资源服务器发出请求
- 资源服务器验证访问令牌，如果有效，处理请求。
你可能会问，什么是Access token，Access token是由授权服务器颁发，授权给客户端，并被资源服务器识别。
Access token是一个字符串，表示授权信息（例如用户信息，权限范围，过期时间...）。
Access token为了安全可能会加密，你应该确保资源服务器可以解密它。
更多详情，请阅读OAuth2.0规范https://www.rfc-editor.org/rfc/rfc6749。
您需要将令牌存储在应用程序的状态中，然后将其随每个请求传递到后端。传递到后端可以在 headers、cookie 或作为参数中完成 - 取决于后端的实现方式。
按照代码查看所有操作的一个很好的例子（不是我的代码）
此示例设置授权：Bearer TOKEN header
https://github.com/cornflourblue/angular-registration-login-example
我们在创建 API 时有 3 个主要的安全问题。
Authentication：像 Google 这样的身份验证提供者只是部分解决方案。因为您不想提示用户为每个 API 请求登录/确认他们的身份，所以您必须自己为后续请求实现身份验证。您必须存储，后端可以访问：
- 一个用户的ID。 （取自身份提供者，例如：电子邮件）
- 一个用户令牌。 （您生成的临时令牌，可以从 API 代码验证）
授权：你的后端必须根据用户ID实现规则（那是你自己的事）。
传输安全：HTTPS 和过期 cookie 是安全的，其他人无法重放。 （HTTPS 正在加密流量，因此可以击败中间人攻击，过期 cookie 可以及时击败重放攻击）
因此您的 API / 后端可以查找 table 电子邮件到随机字符串。现在，您不必公开用户的 ID。令牌是无意义的和临时的。
在此系统中，流程是这样工作的：
User-Agent IdentityProvider (Google/Twitter) Front-End Back-End
|-----------------"https://your.app.com"---------->|
|---cookies-->|
your backend knows the user or not.
if backend recognizes cookie,
user is authenticated and can use your API
其他：
if the user is unknown:
|<--"unknown"-|
|<----"your/login.js"----------+
"Do you Authorize this app?"
|<------------------+
|--------"yes"----->|
+----------auth token--------->|
|<---------/your/moreinfo.js---|
|-------access_token ---------->|
1. verify access token
2. save new user info, or update existing user
3. generate expiring, random string as your own API token
+----------->|
|<-------------- set cookie: your API token --------------------|
现在，用户可以直接使用您的 API:
|--------------- some API request, with cookie ---------------->|
|<-------------- some reply, depends on your logic, rules ------|
编辑
根据讨论 - 添加后端可以通过身份提供者验证访问令牌来验证用户：
例如，Google exposes this endpoint检查令牌XYZ123：
https://www.googleapis.com/oauth2/v3/tokeninfo?id_token=XYZ123
所有的回答我都仔细看了一遍，超过半数的回答者都完全漏掉了问题。在服务提供商发出 OAuth 令牌后，OP 正在请求 FE 和 BE 之间的初始连接。
您的后端如何知道 OAuth 令牌有效？请记住，您的 BE 可以向服务提供商发送请求并确认 OAuth 令牌的有效性，这是您的 FE 最先收到的。此 OAuth 密钥只能由服务提供商解密，因为只有他们拥有密钥。一旦他们解密密钥，他们通常会回复用户名、电子邮件等信息。
总结：
您的 FE 在用户授权后从服务提供商处接收 OAuth 令牌。 FE 将 OAuth 令牌传递给 BE。 BE 将 OAuth 令牌发送给服务提供商以验证 OAuth 令牌。服务提供商用 username/email 信息响应 BE。然后您可以使用 username/email 创建一个帐户。
然后在您的 BE 创建帐户后，您的 BE 应该生成自己的 OAuth 令牌实现。然后你将这个 OAuth 令牌发送给你的 FE，并且在每次请求时，你的 FE 都会在 header 中将这个令牌发送给你的 BE。由于只有您的 BE 拥有验证此令牌的密钥，因此您的应用程序将非常安全。您甚至可以在每次请求时刷新您的 BE 的 OAuth 令牌，每次都为您的 FE 提供一个新密钥。如果有人从您的 FE 窃取了 OAuth 令牌，该令牌将很快失效，因为您的 BE 已经为您的 FE 创建了一个新的 OAuth 令牌。
有更多关于您的 BE 如何验证 OAuth 令牌的信息。 How to validate an OAuth 2.0 access token for a resource server?
我想构建小型应用程序。会有一些用户。我不想制作自己的用户系统。我想将我的应用程序与 oauth/oauth2.0.
集成我的前端应用和oauth 2.0集成没有问题。有很多有用的文章，如何做到这一点，甚至 whosebug.com。例如 this post 很有帮助。
但是。前端授权成功后怎么办？当然，我可以只在客户端上设置标志，上面写着 "okay, mate, user is authenticated"，但我现在应该如何与后端交互？我不能只提出一些要求。后端 - 一些应用程序，它提供 API 功能。每个人都可以访问此 api.
所以，我的 FE 和 BE 之间无论如何都需要一些身份验证系统。这个系统应该如何运作？
ps 我的英语有些问题，可能我不能正确 'ask google' 。请你提供正确的问题:) 或者至少提供一些关于我的问题的文章。
UPD
我正在寻找概念。我不想为我当前的问题找到一些解决方案。我不认为我使用哪个 FE 和 BE 很重要（无论如何我会 请在下方提供相关信息）
FE 和 BE 将使用 JSON 进行通信。 FE 会发出请求，BE 会发送 JSON 响应。我的应用程序将具有以下结构（可能）：
- 前端 - 可能 AngularJS
- 后端-可能Laravel（laravel会实现逻辑，结构上还有数据库）
也许 "service provider" 像 google.com、vk.com、twitter.com 等会记住用户的状态？在FE上认证成功后，我可以直接从BE询问用户状态吗？
好吧，您的前端不需要 User-System。 前端只是一种与您的服务器交互并通过有效用户和密码请求令牌的方式。
您的服务器应该管理用户和权限。
用户登录场景
用户通过输入用户名和密码请求令牌。 server-API 接受请求，因为它是匿名方法（每个人都可以调用此方法而不用关心他是否登录。
服务器检查数据库（或一些存储）并将用户详细信息与他拥有的详细信息进行比较。 如果详细信息匹配，服务器将 return 令牌给用户。
从现在开始，用户应在任何请求中设置此令牌，以便服务器识别用户。 令牌实际上包含用户角色、时间戳等...
当用户通过 API 请求数据时，它从 header 获取用户令牌，并检查是否允许用户访问该方法。
通常情况下就是这样。
我的回答基于 .NET。但是大多数 BE libaries 都是这样工作的。
我正在为 SSO 做一个项目，根据我对你的问题的理解，我可以建议你在你的后端创建一个端点来生成会话，一旦客户端 - 前端 - 已成功获得授权由帐户所有者，并从提供者处获得用户信息，您 post 将该信息发送到后端端点，后端端点生成一个会话并存储该信息，并经常发回会话 ID名为 jSessionId- 带有一个 cookie 返回客户端 -frontend- 因此浏览器可以为您保存它，之后每个请求到后端都被视为经过身份验证的用户。
要注销，只需在后端创建另一个端点以接受会话 ID，以便后端可以将其删除。
希望对您有所帮助。
让我们从OAuth的概念开始，FE这里是Client，BE这里是Resource Server.
- 由于您的客户端已经授权，授权服务器应该授予 访问令牌到客户端。
- 客户端使用访问令牌 向资源服务器发出请求
- 资源服务器验证访问令牌，如果有效，处理请求。
你可能会问，什么是Access token，Access token是由授权服务器颁发，授权给客户端，并被资源服务器识别。
Access token是一个字符串，表示授权信息（例如用户信息，权限范围，过期时间...）。
Access token为了安全可能会加密，你应该确保资源服务器可以解密它。
更多详情，请阅读OAuth2.0规范https://www.rfc-editor.org/rfc/rfc6749。
您需要将令牌存储在应用程序的状态中，然后将其随每个请求传递到后端。传递到后端可以在 headers、cookie 或作为参数中完成 - 取决于后端的实现方式。
按照代码查看所有操作的一个很好的例子（不是我的代码） 此示例设置授权：Bearer TOKEN header https://github.com/cornflourblue/angular-registration-login-example
我们在创建 API 时有 3 个主要的安全问题。
Authentication：像 Google 这样的身份验证提供者只是部分解决方案。因为您不想提示用户为每个 API 请求登录/确认他们的身份，所以您必须自己为后续请求实现身份验证。您必须存储，后端可以访问：
- 一个用户的ID。 （取自身份提供者，例如：电子邮件）
- 一个用户令牌。 （您生成的临时令牌，可以从 API 代码验证）
授权：你的后端必须根据用户ID实现规则（那是你自己的事）。
传输安全：HTTPS 和过期 cookie 是安全的，其他人无法重放。 （HTTPS 正在加密流量，因此可以击败中间人攻击，过期 cookie 可以及时击败重放攻击）
因此您的 API / 后端可以查找 table 电子邮件到随机字符串。现在，您不必公开用户的 ID。令牌是无意义的和临时的。
在此系统中，流程是这样工作的：
User-Agent IdentityProvider (Google/Twitter) Front-End Back-End
|-----------------"https://your.app.com"---------->|
|---cookies-->|
your backend knows the user or not.
if backend recognizes cookie,
user is authenticated and can use your API
其他：
if the user is unknown:
|<--"unknown"-|
|<----"your/login.js"----------+
"Do you Authorize this app?"
|<------------------+
|--------"yes"----->|
+----------auth token--------->|
|<---------/your/moreinfo.js---|
|-------access_token ---------->|
1. verify access token
2. save new user info, or update existing user
3. generate expiring, random string as your own API token
+----------->|
|<-------------- set cookie: your API token --------------------|
现在，用户可以直接使用您的 API:
|--------------- some API request, with cookie ---------------->|
|<-------------- some reply, depends on your logic, rules ------|
编辑
根据讨论 - 添加后端可以通过身份提供者验证访问令牌来验证用户：
例如，Google exposes this endpoint检查令牌XYZ123：
https://www.googleapis.com/oauth2/v3/tokeninfo?id_token=XYZ123
所有的回答我都仔细看了一遍，超过半数的回答者都完全漏掉了问题。在服务提供商发出 OAuth 令牌后，OP 正在请求 FE 和 BE 之间的初始连接。
您的后端如何知道 OAuth 令牌有效？请记住，您的 BE 可以向服务提供商发送请求并确认 OAuth 令牌的有效性，这是您的 FE 最先收到的。此 OAuth 密钥只能由服务提供商解密，因为只有他们拥有密钥。一旦他们解密密钥，他们通常会回复用户名、电子邮件等信息。
总结：
您的 FE 在用户授权后从服务提供商处接收 OAuth 令牌。 FE 将 OAuth 令牌传递给 BE。 BE 将 OAuth 令牌发送给服务提供商以验证 OAuth 令牌。服务提供商用 username/email 信息响应 BE。然后您可以使用 username/email 创建一个帐户。
然后在您的 BE 创建帐户后，您的 BE 应该生成自己的 OAuth 令牌实现。然后你将这个 OAuth 令牌发送给你的 FE，并且在每次请求时，你的 FE 都会在 header 中将这个令牌发送给你的 BE。由于只有您的 BE 拥有验证此令牌的密钥，因此您的应用程序将非常安全。您甚至可以在每次请求时刷新您的 BE 的 OAuth 令牌，每次都为您的 FE 提供一个新密钥。如果有人从您的 FE 窃取了 OAuth 令牌，该令牌将很快失效，因为您的 BE 已经为您的 FE 创建了一个新的 OAuth 令牌。
有更多关于您的 BE 如何验证 OAuth 令牌的信息。 How to validate an OAuth 2.0 access token for a resource server?