问题描述
在使用 Google+ API 进行用户登录时，有时我们会遇到 signinCallback 被调用两次的情况，并且在第二次调用中丢失了 authresult。
原因分析
这个问题通常是由于以下原因之一导致的：
- 多个不同版本的 Google API 脚本同时存在。
- 在同一个页面上多次使用
gapi.auth.signIn()方法。 - 在
gapi.client.init()中使用了ux_mode: "popup"或ux_mode: "redirect"参数，但没有正确处理回调 URL 中的参数。
对于第一种情况，我们需要确保网站上只引入了一个版本的 Google API。如果你使用的是 Google+ API，则应该只包含 <script src="https://apis.google.com/js/client:platform.js?onload=start" async defer></script> 这一行脚本。
对于第二种情况，我们需要确保在页面上只调用一次 gapi.auth.signIn() 方法。如果需要多次进行登录操作，应该考虑将其封装为一个方法并在需要的地方进行调用。
对于第三种情况，我们需要在 gapi.client.init() 调用中使用 ux_mode: "prompt" 参数，并在 signinCallback 回调函数中自行解析 URL 中的参数。
解决方案
针对上述三种情况，我们可以分别采取以下解决方案：
- 只引入一个版本的 Google API。
---- ----- --- ------- ---------------------------------------------------- ------- --------------------------------------------------------- ----- --------------- ---- ----- --- ------- ---------------------------------------------------------------- ----- ---------------
- 将
gapi.auth.signIn()封装为一个方法并在需要的地方进行调用。
-------- ------- -
------------------
--------- ---------------
---------- -----------------
------ -------
---
-
----------------------------------- -
--------
---- 使用
ux_mode: "prompt"参数，并在signinCallback回调函数中自行解析 URL 中的参数。
-------- --------------- -
------------------
------- ---------------
--------- -----------------
-------------- ---------------
------ ------------- ---
-------- --------
---------------- -- -
-- ---
---
-
-------- -------------------------- -
-- ----------- -- ------------------------ -
-- -- ----------
- ---- -
-- -- --- ----
--- ------ - ---
--- ----------- - ---------------------------
--- ----- - --------------------
--- ------
----- ------- - ------------------------- -
------------------------------------ - -----------------------------
-
-- -------------- -
------------------- ------- ------ - - --------------
- ---- -
------------------- ------- -------------
-
-
-结论
在使用 Google+ API 进行用户登录时，我们需要避免引入多个不同版本的 Google API 脚本、多次调用 gapi.auth.signIn() 方法以及正确处理回调 URL 中的参数。采取相应的解决方案可以避免 signinCallback 被调用两次并且在过程中丢失 authresult。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/30286