React: Google "One Tap" callback function not being called

Question

<script src="https://accounts.google.com/gsi/client"></script>
...
declare var google: any;
...

  useEffect(() => {
    const handleCredentialResponse = (response: any) => {
      console.log(response);
    };
    const client_id = process.env.REACT_APP_GOOGLE_CLIENT_ID;
    const callback = handleCredentialResponse;
    const auto_select = true;
    google.accounts.id.initialize({ client_id, callback, auto_select });
    google.accounts.id.prompt((notification: any) => {
      console.log(notification);
    });
  }, []);

Why does handleCredentialResponse not get called at all? The user is prompted to log in, they hit continue and then the function never gets called! Grrr! Above taken from docs here and also here

The notification logs out

nl {g: "display", h: true}
nl {g: "skipped", l: "issuing_failed"}

Hi @Bill, From where have you refered this code? As per documentation I can see only this code — Always_a_learner, Dec 10 '20 at 11:46

Guibin · Accepted Answer · 2020-04-09T04:14:43.397

2

are you testing locally? As mentioned here, you need to add both http://localhost and http://localhost:port_number to the Authorized JavaScript origins box.

edited Apr 09 '20 at 04:14

answered Apr 09 '20 at 04:09

Guibin

734
3
5

score 0 · Answer 2 · answered Sep 30 '22 at 20:11

0

using the js to resolve this issue,

       window.google.accounts.id.initialize({
          client_id: ${clientId},
          callback: data => handleToken(data),
        })
    
It is not clear why the callback method does not take effect in html

answered Sep 30 '22 at 20:11

liubility

31
1

score 0 · Answer 3 · answered Apr 01 '23 at 08:48

I am not sure why, but try adding handleCredentialResponse to the window object. In other words add the following code below the function. I got this answer from this link [GSI_LOGGER]: The value of 'callback' is not a function. Configuration ignored

window.handleCredentialResponse = handleCredentialResponse

React: Google "One Tap" callback function not being called

3 Answers3

Linked