How to stop Google+ Sign-In Button from popping up

Question

I'm adding Google+ sign in button to my site using the server-side flow. Here is how I render the sign in button:

<script type="text/javascript">
    (function () {
        var po = document.createElement('script');
        po.type = 'text/javascript';
        po.async = true;
        po.src = 'https://plus.google.com/js/client:plusone.js?onload=renderGPlus';
        var s = document.getElementsByTagName('script')[0];
        s.parentNode.insertBefore(po, s);
    })();
</script>

<script type="text/javascript">
    function renderGPlus() {
        gapi.signin.render('customGPlusBtn', {
            'callback': 'gPlusSignInCallback',
            'clientid': '<my_client_id>',
            'redirecturi': 'postmessage',
            'accesstype': 'offline',
            'cookiepolicy': 'single_host_origin',
            'requestvisibleactions': 'http://schemas.google.com/BuyActivity',
            'scope': 'https://www.googleapis.com/auth/plus.login https://www.googleapis.com/auth/userinfo.email'
        });
    }
</script>

When the button is loaded, it immediately checks to see if the user has authorized my application (immediate mode). If the user has previously authorized my application, a notification bar will pop up at the bottom of the page with the message "Welcome back, you've already connected with this app via Google+ Sign-In as .....".

Is there anyway to stop this message from popping up?

Answer 1

The accepted answer is the right way to do it, but if for some other reason you just want to hide the generated iframe, you can do it with CSS:

iframe[src^="https://apis.google.com"] {
  display: none;
}

Answer 2

First, the message only appears the first time that a user is signing in as recognized by Google for a particular browser session. In other words, the user will only see the message if they have closed their browser windows and have started a new browser session.

You should be authorizing the user any time that you are seeing the authorization result successfully returning and updating the user to an authorized state. As such, the user is getting automatically signed in whenever this message appears.

Because the message that appears is there to inform your users that they have automatically been signed in, you probably should not be suppressing this message unless you are doing it intentionally for a user whose session you are explicitly managing.

However, if you have implemented explicit sign-out and are managing the user's signed-in state, the following code change to the plusone.js synchronous include will suppress the toast message.

<script src="https://apis.google.com/js/plusone.js">
  isSignedOut: true
</script>

Another note, you no longer need to manage the user's state to sign the user out. The new method gapi.auth.signOut will sign the user out. You can see a demo of signout here.

If you are doing an asynchronous include, the following global configuration flags will suppress the message:

window.___gcfg = { isSignedOut: true };

UPDATE:

As pointed out by Chimdi2000 this solution does not work in Chrome. You can add the following CSS to hide the generated iframe:

iframe[src^="https://apis.google.com"] {
  display: none;
}

As his answer is far more complete than mine and addresses additional issues, please check it out.

Answer 3

Chimdi2000's last style code must be:

<style>
iframe[src^="https://apis.google.com/u/0/_/widget/oauthflow/toast"] {
  display: none;
}
</style>

and runs perfect.

EDIT :

Coding below also hides the login button.

<style>
iframe[src^="https://apis.google.com"] {
    display: none;
}
</style>

Answer 4

Just recently the newly accepted answer on this page for hiding the "Google Sign-in Welcome back pop up"

window.___gcfg = { isSignedOut: true };

does not work again.

AIM: "Hide or Suppress the Google+ Sign In Welcome Back message" on all browsers.

Please if you have been using `

window.___gcfg = { isSignedOut: true };

to suppress the warning. After serious experimentation I discovered this.

I will recommend you use this iframe versions to suppress any kind of Google API pop up window on your web page..

Iframe 1: iframe[src^="https://apis.google.com"] {display: none;} This Hides all pop up windows from Google APIs on your web page.

Iframe 2: iframe[src^="https://apis.google.com/u/0/_/sharebox"] {display: none;} This Hides all Google's Interactive Share Dialog pop up on your web page.

Iframe 3: iframe[src^="https://apis.google.com/u/0/_/widget/oauthflow/toast"] {display: none;} This Hides all "Google's Welcome Back Message" pop up window on your web page.

Iframe 4: iframe[src^="https://apis.google.com/u/0/_/+1/"] {display: none;} This Hides all "Google's +1 Button" on your web page.

So for this particular question do this in the Head tag of your HTML Page

 <style> `iframe[src^="https://apis.google.com/u/0/_/widget/oauthflow/toast` </style>

Have tested it and it works perfectly well.