使用gapi-script实现谷歌登录时同一用户每次登录重复弹出授权提示如何解决

根因说明 #

重复弹出授权提示一般是三个原因导致：

1. 初始化/调用登录方法时强制设置了prompt: 'consent'参数，每次都会触发用户同意流程
2. 未校验当前用户的已有授权状态，每次登录都强制触发新的授权请求
3. 未配置同域名会话共享，不同页面/入口的授权状态不互通

修复步骤 #

1. 调整loadAuth2初始化配置 #

移除强制同意的参数，新增会话共享配置，示例代码如下：

import { loadAuth2 } from 'gapi-script';

const initGapiAuth = async () => {
  return await loadAuth2({
    clientId: 'YOUR_GOOGLE_CLIENT_ID',
    scopes: 'YOUR_REQUEST_SCOPES', // 保持所有请求的scope完全一致，新增scope会触发重新授权
    cookie_policy: 'single_host_origin', // 保证同域名下全系统共享授权状态
    fetch_basic_profile: true
  });
};

2. 登录前先校验已有授权状态 #

未授权时再触发授权弹窗，避免重复请求：

const handleGoogleLogin = async () => {
  const authInstance = await initGapiAuth();
  const currentUser = authInstance.currentUser.get();
  
  // 校验是否已登录且已授予所有需要的权限
  const isAuthed = currentUser.isSignedIn() && currentUser.hasGrantedScopes('YOUR_REQUEST_SCOPES');
  
  if (isAuthed) {
    // 直接使用已有授权凭证处理登录逻辑
    const authRes = currentUser.getAuthResponse(true);
    // 你的后续登录逻辑
    return;
  }

  // 无有效授权时才触发授权弹窗
  authInstance.signIn()
    .then(user => {
      const authRes = user.getAuthResponse(true);
      // 处理授权成功后的登录逻辑
    })
    .catch(err => {
      // 处理授权取消/失败逻辑
    });
};

3. 离线授权场景特殊处理 #

如果你的业务需要获取refresh_token，仅在第一次授权时给signIn方法传入prompt: 'consent'参数，后续所有登录请求都去掉该参数即可。

注意事项 #

• 必须保证所有请求的scopes完全一致，只要新增任意权限，都会触发一次新的授权提示让用户同意新权限，属于正常逻辑
• 不要在浏览器隐身模式下测试，隐身模式不会持久化授权信息，每次打开都会重新触发授权
• 用户如果在谷歌账号的安全设置页手动取消了对你应用的授权，下次登录也会重新弹出授权提示，属于正常逻辑

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