[英]From Google JWT to Access and Refresh tokens using React and Node.js
I have a MERN application and I want to obtain the following behaviour in my app:我有一个 MERN 应用程序,我想在我的应用程序中获得以下行为:
GoogleLogin
component in the @react-oauth/google
package用户使用@react-oauth/google
package 中的GoogleLogin
组件通过 google 登录I managed to get this done with the GoogleLogin
from react-google-login
package, which gives you a code that can be exchanged for tokens in the backend.我设法通过react-google-login
package 中的GoogleLogin
完成了这项工作,它为您提供了一个可以在后端交换令牌的代码。 But this library has been recently deprecated (when I try to log in with this button I get this error: idpiframe_initialization_failed
).但是这个库最近已被弃用(当我尝试使用此按钮登录时,我收到此错误: idpiframe_initialization_failed
)。 I don't know anymore how to use this library.我不知道如何使用这个库了。
This is the code that I use to login:这是我用来登录的代码:
<GoogleOAuthProvider clientId={"MY_CLIENT_ID"}>
<GoogleLogin
onSuccess={this.onSuccess}
onFailure={this.onFailure}
/>
</GoogleOAuthProvider>;
And this is the object I get when the log in is successful:这是我登录成功时得到的object:
{
clientId: "MY_CLIENT_ID"
credential: "JWT_string"
select_by: "btn"
}
I'm not sure this is the right approach to use in order to get access and refresh tokens to use in the backend, or if there's a better way to do so with the new Google Identity Services SDK.我不确定这是为了获取访问和刷新令牌以在后端使用的正确方法,或者是否有更好的方法来使用新的 Google 身份服务 SDK。
What a coincidence,, I'm currently working on a blog to explain OIDC, OAuth.真是巧合,我目前正在写博客来解释 OIDC,OAuth。 and the new Google Identity Services, and somehow I saw this question.和新的谷歌身份服务,不知何故我看到了这个问题。
let me give a TLDR version to explain different response_type first.让我先给出一个 TLDR 版本来解释不同的response_type 。
access_token
and refresh_token
are part of Implicit Flow with response_type=token and Authorization code flow with response_type=code as defined in OIDC 1.0 Core spec . access_token
和refresh_token
是具有 response_type=token 的隐式流和具有 response_type=code 的授权代码流的一部分,如OIDC 1.0 核心规范中所定义。Here is a small demo link in case you want to play with different auth methods.如果您想使用不同的身份验证方法,这是一个小的演示链接。
I want to "extract" access and refresh tokens from this JWT (decoding it in some way?)我想从这个 JWT 中“提取”访问和刷新令牌(以某种方式对其进行解码?)
I don't think so.我不这么认为。 Since id_token
was never meant for that purpose.因为id_token
从来就不是为了这个目的。
I want to store the tokens persistently so that I can access the user's calendar whenever I want我想永久存储令牌,以便我可以随时访问用户的日历
I would suggest not using id_token
since you need access_token
and refresh_token
.我建议不要使用id_token
,因为您需要access_token
和refresh_token
。 You can consider the following flow:您可以考虑以下流程:
response_type=code
to get the code
.使用带有response_type=code
的授权代码流来获取code
。code
get the refresh_token
by making a POST request to https://oauth2.googleapis.com/token
.使用code
通过向https://oauth2.googleapis.com/token
发出 POST 请求来获取refresh_token
。 (The response will also contain access_token. Just ignore it.) Or you can also use google-api-nodejs-client library. (响应也将包含 access_token。忽略它。)或者您也可以使用google-api-nodejs-client库。POST
request to https://www.googleapis.com/oauth2/v4/token
with the following BODY to get the access_token
.使用以下 BODY 向https://www.googleapis.com/oauth2/v4/token
发出POST
请求以获取access_token
。{
"grant_type": "refresh_token",
"refresh_token": "YOUR_REFRESH_TOKEN",
"client_id": "YOUR_VALUE.apps.googleusercontent.com",
"client_secret": "YOUT_SECRET_VALUE"
}
Do let me know if that helps.如果有帮助,请告诉我。 Cheers.干杯。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.