使用Auth0+Next.js时Google Contacts API权限范围申请问题

1. 修复Auth0权限范围配置报错 #

你之前直接把谷歌API的scope添加到handleAuth顶层参数会报错，原因是Auth0默认会将额外传入的scope识别为自身注册的API权限，而非谷歌身份提供商的权限，正确配置方式如下：

• 首先登录Auth0控制台，进入「认证」-「社交」板块，打开你配置的谷歌连接，切换到「权限」标签页，除了已勾选的Contacts选项，手动在自定义scope输入框中添加两个谷歌联系人权限：
  https://www.googleapis.com/auth/contacts.readonly
https://www.googleapis.com/auth/contacts.other.readonly
  保存配置。
• 修改pages/api/auth/[...auth0].ts的代码，在登录方法的authorizationParams中传入完整scope：

import { handleAuth, handleLogin } from '@auth0/nextjs-auth0';

export default handleAuth({
  async login(req, res) {
    await handleLogin(req, res, {
      authorizationParams: {
        // 此处的值要和你Auth0控制台中谷歌连接的标识名称一致，默认是google-oauth2
        connection: 'google-oauth2',
        scope: 'openid profile email https://www.googleapis.com/auth/contacts.readonly https://www.googleapis.com/auth/contacts.other.readonly'
      }
    });
  }
});

2. 调整联系人接口调用逻辑 #

你之前仅调用people.connections.list只能获取主联系人列表，要获取「其他联系人」需要额外调用otherContacts.list接口，对应contacts.other.readonly权限，调整后的GoogleContactsService代码如下：

export default class GoogleContactsService extends AbstractGoogleService {
    // 同时拉取主联系人和其他联系人
    async search(options?: any) {
        const service = google.people({ version: 'v1', headers: {
            authorization: `Bearer ${this._config.accessToken}`
        }})
        
        // 并行请求两类联系人数据
        const [mainContactsRes, otherContactsRes] = await Promise.all([
            // 主联系人，对应contacts.readonly权限
            service.people.connections.list({
                resourceName: 'people/me',
                pageSize: 100,
                personFields: 'names,emailAddresses'
            }),
            // 其他联系人，对应contacts.other.readonly权限
            service.otherContacts.list({
                readMask: 'names,emailAddresses',
                pageSize: 100
            })
        ])

        // 可根据需求合并两类数据后返回
        return {
            mainContacts: mainContactsRes.data,
            otherContacts: otherContactsRes.data
        }
    }
}

3. 调整谷歌权限验证提交内容 #

谷歌反馈只检测到一个权限的原因是你提交验证时没有在谷歌云控制台完整添加两个scope并说明使用场景，操作如下：

• 登录谷歌云控制台，进入「API和服务」-「OAuth同意屏幕」页面，切换到「范围」标签页
• 依次添加两个联系人权限，分别填写每个权限的使用说明：
  • https://www.googleapis.com/auth/contacts.readonly：用于读取用户的主联系人列表，支持用户选择联系人导入至应用
  • https://www.googleapis.com/auth/contacts.other.readonly：用于读取用户的其他联系人列表，支持用户选择联系人导入至应用
• 提交验证时附带演示视频，完整展示用户授权、获取联系人、导入使用的全流程即可。

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