通过Google账号登录时如何获取用户个人信息？

你拿到的credential字段是一个JWT令牌，用户的姓名、邮箱、头像等个人信息都加密存储在这个令牌里，只需解析就能获取这些数据。

步骤1：确保请求了正确的权限范围 #

在你的g_id_onload配置中，必须添加data-scopes属性指定所需的用户数据范围，示例如下：

<div id="g_id_onload"
     data-client_id="MY_CLIENT_ID"
     data-context="signin"
     data-ux_mode="popup"
     data-callback="handleGoogleSignIn"
     data-login_uri="https://MY_LOGIN_PAGE"
     data-auto_prompt="false"
     data-scopes="openid email profile"> <!-- 新增权限范围配置 -->
</div>

其中openid是OpenID Connect流程的必填项，email用于获取邮箱信息，profile用于获取姓名、头像等基础个人信息。

步骤2：解析JWT令牌获取用户信息 #

前端解析（仅用于展示，不处理敏感逻辑）

JWT由三个Base64编码片段组成，可通过原生JS解码：

function handleGoogleSignIn(response) {
  // 拆分JWT的三个部分
  const [header, payload, signature] = response.credential.split('.');
  // 处理Base64URL编码的特殊字符，再解码payload
  const decodedPayload = JSON.parse(atob(payload.replace(/-/g, '+').replace(/_/g, '/')));
  
  // 访问解析后的用户信息
  console.log('用户名:', decodedPayload.name);
  console.log('邮箱:', decodedPayload.email);
  console.log('头像地址:', decodedPayload.picture);
  console.log('唯一用户ID:', decodedPayload.sub);
}

注意：前端解析的JWT未经过服务器验证，不能直接用于敏感业务操作（如创建用户账号），存在被篡改的风险。

后端解析（安全推荐）

将credential发送到你的后端服务器，使用官方库验证并解析令牌，以确保数据可信。以Node.js为例，使用google-auth-library：

const { OAuth2Client } = require('google-auth-library');
const client = new OAuth2Client('MY_CLIENT_ID');

async function verifyGoogleToken(token) {
  const ticket = await client.verifyIdToken({
      idToken: token,
      audience: 'MY_CLIENT_ID', // 填写你的Client ID
  });
  const payload = ticket.getPayload();
  // 验证后的payload包含可信的用户信息
  return payload;
}

后端验证后的数据可安全用于用户注册、登录等核心业务逻辑。

额外检查项 #

• 确认你的Google Cloud项目OAuth consent screen中已添加email和profile权限范围，且针对外部用户时状态为已发布。
• 检查Client ID配置无拼写错误。

内容的提问来源于stack exchange，提问作者taichi_tiger