Android端Ionic Vue3使用CapacitorGoogleAuth登录无法获取邮箱

选中账号后无法获取邮箱地址，大概率是以下几个原因导致，对应解决方案如下：

1. 权限范围未正确配置 #

CapacitorGoogleAuth需要明确配置获取邮箱的权限范围，否则Google不会返回邮箱信息：

• 打开capacitor.config.ts（或capacitor.config.json），检查GoogleAuth配置的scopes是否包含email和profile：

// capacitor.config.ts
import { CapacitorConfig } from '@capacitor/cli';

const config: CapacitorConfig = {
  // 其他配置项
  plugins: {
    GoogleAuth: {
      scopes: ['email', 'profile'],
      clientId: '你的Google客户端ID',
      serverClientId: '你的服务器端客户端ID（按需配置）'
    }
  }
};

export default config;

• 同时要在Google Cloud Console的OAuth consent screen中，添加../auth/userinfo.email和../auth/userinfo.profile权限范围；测试阶段需确保已添加测试用户，正式发布需完成应用审核。

2. 用户信息获取方式错误 #

CapacitorGoogleAuth的signIn()返回的用户对象结构并非统一使用getBasicProfile()方法，不同版本插件返回格式有差异。先打印完整用户对象确认结构，再调整获取方式：

GoogleAuth.signIn().then(
  (user) => {
    // 先打印完整用户对象，查看实际字段结构
    console.log('用户完整信息:', user);
    // 尝试直接读取字段
    let email = user.email || user?.basicProfile?.email;
    alert(email);
  },
  (error) => {
    console.error('登录错误详情:', error);
  }
);

3. 异常处理不完整 #

你的代码中catch块为空，且错误回调仅打印日志，可能遗漏了关键错误信息。建议改用async/await简化代码并完善异常捕获：

const logIn = async () => {
  try {
    const user = await GoogleAuth.signIn();
    console.log('用户信息:', user);
    const email = user.email || user?.basicProfile?.email;
    alert(email);
  } catch (e) {
    console.error('登录异常:', e);
    alert('登录失败：' + e.message);
  }
};

4. 插件版本兼容性问题 #

检查CapacitorGoogleAuth版本是否与当前Capacitor、Ionic版本兼容，旧版本可能存在返回结构异常。建议更新至最新稳定版：

npm update @codetrix-studio/capacitor-google-auth

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