集成Sign in with Google按钮致游戏网站卡顿，拦截请求仍无效

核心原因 #

这些POST https://play.google.com/log请求是Google登录库内置的分析/日志上报请求，AdBlocker拦截时会触发浏览器的网络错误回调，部分场景下这些错误处理逻辑会阻塞主线程，进而导致游戏卡顿。

可行解决方案 #

• 禁用Google登录的分析上报
  Google Identity Platform的登录配置支持关闭分析功能，在初始化登录客户端时添加对应配置即可：

  • JS初始化示例：

    google.accounts.id.initialize({
      client_id: '你的客户端ID',
      callback: handleCredentialResponse,
      disableLogging: true // 关键配置，关闭日志上报
    });
    

  • HTML按钮示例：

    <div class="g_id_signin" data-client_id="你的客户端ID" data-disable-logging="true"></div>
    

• 自定义AdBlocker规则避免拦截错误
  如果不想关闭日志上报，可以给AdBlocker添加规则，让该请求被允许发送（而非拦截），避免触发错误事件：

  @@||play.google.com/log$xmlhttprequest,domain=你的游戏域名
  

  替换你的游戏域名为实际域名后，请求会正常发送，不会引发拦截错误导致的卡顿。

• 全局拦截并静默处理错误
  通过监听网络请求事件，捕获该请求的错误并阻止默认处理逻辑：

  // 拦截XMLHttpRequest
  const originalOpen = XMLHttpRequest.prototype.open;
  XMLHttpRequest.prototype.open = function(method, url) {
    if (url.includes('play.google.com/log')) {
      this.addEventListener('error', (e) => {
        e.preventDefault();
        e.stopPropagation();
      });
    }
    return originalOpen.apply(this, arguments);
  };
  
  // 拦截fetch请求
  const originalFetch = window.fetch;
  window.fetch = async function(resource) {
    if (typeof resource === 'string' && resource.includes('play.google.com/log')) {
      try {
        return await originalFetch.apply(this, arguments);
      } catch (err) {
        // 静默忽略错误
        return new Response(null, { status: 204 });
      }
    }
    return originalFetch.apply(this, arguments);
  };
  

  这种方式无需修改登录配置，直接阻止错误事件扩散导致的主线程阻塞。

注意事项 #

• 优先使用官方提供的disableLogging配置，这是最合规且无副作用的方案。
• 自定义AdBlocker规则时务必指定游戏域名，避免影响其他网站的正常请求。
• 全局拦截网络请求的方式需要测试兼容性，确保不会干扰游戏内其他正常网络操作。

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