CODEWITHSUNDEEP
javascriptgoogle-signin
Adam
Adam

Reputation: 6192

`Uncaught TypeError: Cannot read property 'signOut' of undefined`

I get error:

Uncaught TypeError: Cannot read property 'signOut' of undefined

On this line: auth2.signOut()

I do NOT have the google signin button on the page below. I also tried executing function signOutGoogle, but that too results in an error.

Top of page my page in <head>:

<meta name="google-signin-scope" content="profile email">
<meta name="google-signin-client_id" content="MYAPPIDPLACEHOLDERWHICHIFILLEDOUT.apps.googleusercontent.com">

Before </body> tag I have:

<script src="https://apis.google.com/js/platform.js?onload=onLoad" async defer></script>

JavaScript code:

function onLoad() {
    console.error('onLoad executed.');
    var auth2;
    gapi.load('auth2', function () {
        auth2 = gapi.auth2.init({
           client_id: 'MYAPPIDPLACEHOLDERWHICHIFILLEDOUT.apps.googleusercontent.com'
        });
        auth2 = gapi.auth2.getAuthInstance();
    });  
           
    //check if url contains ?signout=true
    var url = window.location.href;
    if (url.toString().indexOf('?signout=true') != -1) {
        console.error('param found');

        auth2.signOut().then(function () {
            console.error('User signed out');
        });
    }
}

UPDATE 1

enter image description here

For some reason ga is called (which I don't do explicitly myself) and failing, what's happening here?

I already checked here:

UPDATE 2

Now I'm getting error

Uncaught Error: ia

enter image description here

UPDATE 3

I tried removing calling noload from the script call and then add it to document.ready to then call signout function, but then even with @Vishal's code the API is not yet available:

<script src="https://apis.google.com/js/platform.js"></script></body>

And:

    $(document).ready(function () {
        var url = window.location.href;
        if (url.toString().indexOf('?signout=true') != -1) {
            console.error('onLoad executed.');
            var auth2;
            gapi.load('auth2', function () {
                auth2 = gapi.auth2.init({
                    client_id: 'MYAPPIDPLACEHOLDERWHICHIFILLEDOUT.apps.googleusercontent.com'
                }).then(() => {
                    auth2 = gapi.auth2.getAuthInstance();
                    auth2.signOut().then(function () {
                        console.error('User signed out');
                    });
                }).catch(err => {
                    console.log(err);
                });
            });
        }
    });

Upvotes: 2

Views: 2336

Answers (3)

Vishal P Gothi
Vishal P Gothi

Reputation: 997

Your javascript code should be like below, and in the code, I have added the logout execution in the then() section of the init action. so logout code only executes once init is back with a response from the server.

function onLoad() {
    console.error('onLoad executed.');
    var auth2;
    gapi.load('auth2', function () {
        auth2 = gapi.auth2.init({
           client_id: 'MYAPPIDPLACEHOLDERWHICHIFILLEDOUT.apps.googleusercontent.com'
        }).then(() => {
           auth2 = gapi.auth2.getAuthInstance();
           //check if url contains ?signout=true
           var url = window.location.href;
           if (url.toString().indexOf('?signout=true') != -1) {
              console.error('param found');

              auth2.signOut().then(function () {
                   console.error('User signed out');
              });
            }
         }).catch(err => {
             console.log(err);
         });
        
    });
}

Upvotes: 2

JoelBonetR
JoelBonetR

Reputation: 1572

  function onLoad() {
    console.error("onLoad executed.");
    var auth2;

    const oauthLogin = new Promise((resolve, reject) => {
      gapi.load("auth2", function () {
        auth2 = gapi.auth2.init({
          client_id: "MYAPPIDPLACEHOLDERWHICHIFILLEDOUT.apps.googleusercontent.com",
        });
        auth2 = gapi.auth2.getAuthInstance();
      });
    });

    oauthLogin.then(() => {
      if (window.location.href.indexOf("?signout=true") != -1) {
        console.error("param found");
        auth2.signOut().then(function () {
          console.error("User signed out");
        });
      }
    });
  }

You can assign a promise to a variable and execute some code after it's resolved like this. There are multiple ways for achieving that, check Promise.prototype.then() reference.

by the way you don't need to parse window.location.href to String because it location.href is a stringifier that returns a USVString which fits for your purpose.

Upvotes: 0

ErrorGamer2000
ErrorGamer2000

Reputation: 325

Your problem is most likely that your code is calling the signOut function before the auth2 variable is defined. Based on your code, the callback from gapi.load will not execute immediately, and, because JavaScript is compiled, the

var url = window.location.href;
if (url.toString().indexOf('?signout=true') != -1) {
    console.error('param found');

    auth2.signOut().then(function () {
    console.error('User signed out');
    });
}

part of your code is being called while auth2 is still undefined. Try putting it inside your callback, like so:

function onLoad() {
    console.error('onLoad executed.');
    var auth2;
    gapi.load('auth2', function () {
        auth2 = gapi.auth2.init({
           client_id: 'MYAPPIDPLACEHOLDERWHICHIFILLEDOUT.apps.googleusercontent.com'
        });
        auth2 = gapi.auth2.getAuthInstance();
           
        //check if url contains ?signout=true
        var url = window.location.href;
        if (url.toString().indexOf('?signout=true') != -1) {
            console.error('param found');

            auth2.signOut().then(function () {
                console.error('User signed out');
            });
        }
    });
}

Upvotes: 1

Related Questions