Getting "gapi.client is undefined" when trying to retrieve an authenticated Google+ user's email address

Question

I'm trying to retrieve user data from a visitor who has signed in to my site using google + sign in button, but I just end up with the message "TypeError: gapi.client is undefined" in the javascript console.

Since I could not identify the error I finally copy/pasted the example code from Google, which can be found here: https://developers.google.com/+/web/people/#retrieve_an_authenticated_users_email_address

The only thing I changed was the Client ID (for web applications).

And I STILL get the same error!

Since the example code does not work for me, I'm thinking, maybe my settings in the Google API Console are wrong. I have tried to follow the instructions:

• Google+ API Service is active
• Redirect URIs: none
• JavaScript origins are set to localhost and the actual production domain.

Have also tried to upload the example code to the production server, just to see if this was a local environment issue, but I still get the same error.

Solution 1

You must include the script and include the client API in addition to the plusone script:

<script src="https://apis.google.com/js/client:plusone.js" type="application/javascript"></script>

The demo page was doing it incorrectly, which I've fixed.

Solution 2

gapi.client.load('plus', 'v1', function() {

    var request = gapi.client.plus.people.get({
        'userId': 'me'
    });

    request.execute(function(response) {
        console.log(response);   
    });
});