如何在使用 google 一键 javascript API 时定义变量 google

Question

我正在按照此文档 google one tap sign in 在我的 React 应用程序中实现 google 一键登录。

我已将以下代码添加到我的组件 JSX 中，我开始收到 google 登录提示：

  const handleCredentialResponse = response => {
    console.log('response', response);
  };

return (
    <Fragment>
      <div
        id="g_id_onload"
        data-auto_select = 'false'
        data-client_id={clientId}
        data-callback={(e) => handleCredentialResponse(e)}>
      </div>
    </Fragment>
  );

我面临的问题是回调函数没有触发。在寻找解决方案后，我偶然发现了这个。 OP 提出了类似的问题，并使用 javascript API 语法显示 google 一键而不是 HTML 代码为了解决上述问题，我阅读了这份文档 Use the One Tap JavaScript API。但是我无法理解变量 google 是从哪里来的？

示例代码：

window.onload = function () {
    google.accounts.id.initialize({
      client_id: 'YOUR_GOOGLE_CLIENT_ID',
      callback: handleCredentialResponse
    });
    google.accounts.id.prompt();
  }

如果有人能告诉我这可能会解决我的回调函数未触发的问题。谢谢！

Answer 1

我在 Nilesh Patel 和这个包 react-google-one-tap-login 发表的评论的帮助下找到了解决方案。

查看上述包中的源代码我设法发现我必须

替换：

 google.accounts.id.initialize({
    client_id: CLIENT_ID,
    callback: data => handleCredentialResponse(data),
    state_cookie_domain: 'https://example.com',
  });

和

 window.google.accounts.id.initialize({
    client_id: CLIENT_ID,
    callback: data => handleCredentialResponse(data),
    state_cookie_domain: 'https://example.com',
  });

如何在使用 google 一键 javascript API 时定义变量 google

how to define variable google when using google one tap javascript API

javascript

reactjs

google-signin

google-identity

google-one-tap