启用FEDcm后如何检测Google One Tap模态框是否显示？

FEDcm本身提供了原生的状态回调机制，完全可以替代isDisplayed方法来监听登录提示的弹出时机，具体实现方式如下：

• 初始化FEDcm配置时，通过native_callback参数监听提示状态
  这个回调会在登录提示的状态发生变化时触发，其中type: 'display'事件就对应提示成功弹出的时机，你可以在这个分支里执行自定义操作（比如弹出广告邮件注册模态框）。

  示例代码：

  // 初始化Google One Tap（FEDcm模式）
  window.google.accounts.id.initialize({
    client_id: '你的Google OAuth客户端ID',
    // 处理登录成功的回调
    callback: (response) => {
      // 这里处理用户登录后的逻辑
    },
    // 监听提示状态变化的回调
    native_callback: (result) => {
      switch(result.type) {
        case 'display':
          // 登录提示已弹出，执行你的自定义操作
          showEmailSignupModal();
          break;
        case 'dismiss':
          // 登录提示被用户关闭，可做后续处理（可选）
          break;
        // 其他状态如success、error等可按需处理
      }
    }
  });
  
  // 触发登录提示
  window.google.accounts.id.prompt();
  

• 关键注意点

  • native_callback是FEDcm专为原生提示状态监听设计的回调，无需依赖DOM元素的状态检测
  • 确保你的网站域名已在Google Cloud控制台的OAuth 2.0授权域名列表中，否则提示可能无法正常显示
  • 不要同时使用旧版One Tap API和FEDcm API，避免出现兼容性问题

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