ITP浏览器/Safari中Google一键登录时ID Token无nonce问题

1. 改用JavaScript显式初始化One Tap，传入nonce #

ITP环境下，仅通过HTML属性配置的data-nonce可能无法被升级版One Tap UX正确读取。建议通过JavaScript代码直接初始化，显式传递nonce参数：

window.onload = function () {
  // 初始化Google身份服务
  google.accounts.id.initialize({
    client_id: '<%=google_client_id%>',
    context: 'signin',
    ux_mode: 'popup',
    login_uri: '<%=site_address%>/sign-in-with-google-callback',
    nonce: '<%=idTokenNonce%>',
    itp_support: true
  });

  // 渲染登录按钮
  google.accounts.id.renderButton(
    document.getElementById('g_id_signin'),
    { 
      type: 'standard', 
      shape: 'rectangular', 
      theme: 'outline', 
      text: 'signin_with', 
      size: 'large', 
      logo_alignment: 'left' 
    }
  );

  // 触发One Tap提示
  google.accounts.id.prompt();
};

注意：需要移除页面中原有的g_id_onload div，避免重复初始化冲突。

2. 确认nonce的注入逻辑 #

确保生成的idTokenNonce在页面渲染时被正确注入到JavaScript代码中，而非仅依赖HTML属性。ITP环境下，部分HTML属性的读取可能受到跨站跟踪限制的影响，直接在JS中传递参数更可靠。

3. 检查回调地址与同域配置 #

确保login_uri指向当前站点的同域地址，ITP对跨域回调的限制更为严格，同域回调能减少参数丢失的概率。

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