如何使用授权令牌获取 Google 用户 openid？

Question

我正在尝试在 vueJs SPA（正面）和 ASP.NET CORE WEB API（背面）上实现 google Oauth2 身份验证。
但是我不知道如何处理用户正确登录后发送的授权码。

我想要达到的目标：

我想使用 GSI 库实现一个 Oauth2 进程来获取用户唯一的OPENID代码。

<script src="https://accounts.google.com/gsi/client" async defer></script>

我希望能够创建一个自定义的谷歌登录按钮，当点击它时会打开一个身份验证弹出窗口。

我现在设法实现了什么？

我已经使用以下功能设置了谷歌登录流程：

google.accounts.id.initialize({...})
      

然后，我被迫使用这种方法呈现一个谷歌按钮：

google.accounts.id.renderButton(buttonWrapper, {
          theme: 'outline',
          size: 'medium',
          type: 'standard',
        });

当用户单击该按钮时，它会打开一个登录弹出窗口。
当他正确注册时，回调 function 给了我一个response.credential ，它是一个 jwtToken
我将 JWTToken 发送到我的 ASP NET CORE WEB API 并验证它：

[...]
var payload = 等待 GoogleJsonWebSignature.ValidateAsync(token);
[...]

有效载荷给了我用户信息，比如他的 email、他的名字和......他的openId 。 成功

为什么我对以前的方法不满意？

• 以前的方法强制我使用 google.accounts.id.renderButton。 我对谷歌通过按钮为我们提供的自定义选项不满意。

• 我没有使用 Oauth2 标准身份验证方法，这也是我练习的重点。

当我尝试 Oauth2 方式时会发生什么？

首先，我正在设置一个客户端。

this.client = google.accounts.oauth2.initTokenClient({
      client_id: this.clientId,
      scope:
        'https://www.googleapis.com/auth/userinfo.email https://www.googleapis.com/auth/userinfo.profile openid',
      callback: this.onTokenReceivedCallback,
    });

然后我创建一个自定义按钮，在单击时触发此方法

function(){
 this.client.requestAccessToken();
}

如果用户单击该按钮，则会出现登录弹出框。
如果用户登录，回调function 会触发，我会收到如下所示的响应。

access_token: "ya29.A0ARrdyM_x7n9uh5LkD4mNWRUgSQHcvcgblSfhkL4dft5Jap4EFN5h7jMSFSmoZTitklLk7Qbte9QsRgUr0wbqjvUMZabqaXVDmmomNrfO_bhLIP-9llQNExSZFNZA2mH5Pzeaq_UiE1mNlfQfhVXQyBv0Hbr1dgYUNnWUtBVEFTQVRBU0ZRRl91NjFWNTNYaVpRa3k0cGRXTWlqZ0pwZGd0Zw0165"
authuser: "1"
expires_in: 3599
prompt: "none"
scope: "email profile https://www.googleapis.com/auth/userinfo.email https://www.googleapis.com/auth/userinfo.profile openid"
token_type: "Bearer"

现在，问题开始了，因为我完全不知道我应该用那个 access_token 做什么。
此代码不是 JwtToken，因此我以前的方法不起作用。
我想我应该将此 accessToken 发送到我的 ASP .NET CORE WEB API。
该文档提到了许多 api，如谷歌日历、谷歌驱动器、email 等，但我对这些都不感兴趣。
我想要的很简单：
我想检索用户OPENID代码。
我将使用它在我的数据库中搜索现有用户。

Every tutorial I read are not clear (for me) about that and they always consider that I'm using an ASP .NET CORE WEB APP which is REALLY different than an ASP .NET CORE WEB API because the user never directly interact with the last one.

任何帮助，将不胜感激。
感谢您的时间和帮助。