I need both "log in with Google" and "sign up with Google" buttons on the same page

Struggling to understand how to achieve this, even though it's extremely commonplace across the web.

I have two modals, one is a "sign up" modal, the other is a "log in" modal. I need to be able to perform both actions via a user's Google account. I am successfully creating and logging in users via the Google API.

The trouble comes with the fact that Google's drop-in button automatically signs the user in.

On the page I have:

<div class="g-signin2" data-onsuccess="googleSignUp"></div>

And later:

<div class="g-signin2" data-onsuccess="googleLogIn"></div>

Obviously these two buttons have different onsuccess functions, but both are being called when the user is logged in. I have somewhat alleviated the problem by only actually getting the Google script on a button click:

$('a#google-login').click(function() {
    $.getScript('https://apis.google.com/js/platform.js');
})

But the behaviour of this whole setup is less than ideal. Is there a common fix for this? It seems incredibly frustrating that Google automatically runs onsuccess functions if the user is logged in (eg without any user action). What's the point of having a button if it runs without user action?

So: I want to be able to log users in via Google, and also sign users up via Google, but only if the user actually clicks a button, in both cases.

Answers


You can achieve what you want by implementing Google Sign-In buttons with imperative approach. My recommendation is to use the custom buttons. That way you will get more control over the API. Check out this doc: https://developers.google.com/identity/sign-in/web/build-button

And this video might help as well. https://www.youtube.com/watch?v=Oy5F9h5JqEU]

Here's a sample code https://github.com/GoogleChrome/google-sign-in


Need Your Help

Search result display in Facebook Graph API

facebook-graph-api facebook-c#-sdk

Hi I am currently working on Search feature of Facebook Graph API using C# SDK.

Displayed URL does not match view

c# asp.net-mvc-4

We are developing an MVC 4 application in C# (.NET 4.5, VS2012), and I have a navigation issue, where the controller (ReportsController.cs) explicitly names a view to return, as in: