Just check for user's Google organization in JavaScript and then display content?

Question

I'm trying to figure out how to use Google's API service, and I have a client and API key for Google OAuth. Specifically, though I want to check a user's organization, and then echo out some info for them. I understand that that info will be visible with a simple CTRL-SHIFT-I or CTRL-U, but that doesn't matter to me right now. Thanks for your help in advance (JavaScript because I want to try to host this on GitHub pages)!

Here's a Google example I've tried, and I just get error 400's (client and API keys have been deleted).

// Enter an API key from the Google API Console:
//   https://console.developers.google.com/apis/credentials
var apiKey = 'AIzaSyDyyNLwHpVqy88tRamPt1NbyVWFzYkLuhA';
// Enter the API Discovery Docs that describes the APIs you want to
// access. In this example, we are accessing the People API, so we load
// Discovery Doc found here: https://developers.google.com/people/api/rest/
var discoveryDocs = ["https://people.googleapis.com/$discovery/rest?version=v1"];
// Enter a client ID for a web application from the Google API Console:
//   https://console.developers.google.com/apis/credentials?project=_
// In your API Console project, add a JavaScript origin that corresponds
//   to the domain where you will be running the script .apps.googleusercontent.com.
var clientId = '873243932753-jfebiqi1ja0b9a2jiqdiirb8vtjlk4n9.apps.googleusercontent.com.apps.googleusercontent.com';
// Enter one or more authorization scopes. Refer to the documentation for
// the API or https://developers.google.com/people/v1/how-tos/authorizing
// for details.
var scopes = 'profile';
var authorizeButton = document.getElementById('authorize-button');
var signoutButton = document.getElementById('signout-button');

function handleClientLoad() {
  // Load the API client and auth2 library
  gapi.load('client:auth2', initClient);
}

function initClient() {
  gapi.client.init({
    apiKey: apiKey,
    discoveryDocs: discoveryDocs,
    clientId: clientId,
    scope: scopes
  }).then(function() {
    // Listen for sign-in state changes.
    gapi.auth2.getAuthInstance().isSignedIn.listen(updateSigninStatus);
    // Handle the initial sign-in state.
    updateSigninStatus(gapi.auth2.getAuthInstance().isSignedIn.get());
    authorizeButton.onclick = handleAuthClick;
    signoutButton.onclick = handleSignoutClick;
  });
}

function updateSigninStatus(isSignedIn) {
  if (isSignedIn) {
    authorizeButton.style.display = 'none';
    signoutButton.style.display = 'block';
    makeApiCall();
  } else {
    authorizeButton.style.display = 'block';
    signoutButton.style.display = 'none';
  }
}

function handleAuthClick(event) {
  gapi.auth2.getAuthInstance().signIn();
}

function handleSignoutClick(event) {
  gapi.auth2.getAuthInstance().signOut();
}
// Load the API and make an API call.  Display the results on the screen.
function makeApiCall() {
  gapi.client.people.people.get({
    'resourceName': 'people/me',
    'requestMask.includeField': 'person.names'
  }).then(function(resp) {
    var p = document.createElement('p');
    var name = resp.result.names[0].givenName;
    p.appendChild(document.createTextNode('Hello, ' + name + '!'));
    document.getElementById('content').appendChild(p);
  });
}

<p>Say hello using the People API.</p>

<!--Add buttons to initiate auth sequence and sign out-->
<button id="authorize-button">Authorize</button>
<button id="signout-button">Sign Out</button>

<div id="content"></div>

<script async defer src="https://apis.google.com/js/api.js" onload="this.onload=function(){};handleClientLoad()" onreadystatechange="if (this.readyState === 'complete') this.onload()">
</script>

Edit: I found out that this needs to be done with Admin SDK. Still a bit confused on how to do this though.

What have you tried so far? Most questions here require you to produce a [Minimal, Complete, and Verifiable example](https://stackoverflow.com/help/mcve). — cb64, Feb 16 '19 at 22:58
I used a Google example, but I kept getting error 400's: please choose a valid API when I request the people API. Give me a sec, I'll put in what I've tried — Widdles, Feb 16 '19 at 23:03

score 0 · Answer 1 · answered Jun 13 '19 at 15:05

As you mentioned this needs to be done using the Admin sdk API. under the users > get section you can try that API and it will provide you an example about how to use it on JS.

function authenticate() {
    return gapi.auth2.getAuthInstance()
        .signIn({scope: "https://www.googleapis.com/auth/admin.directory.user https://www.googleapis.com/auth/admin.directory.user.readonly"})
        .then(function() { console.log("Sign-in successful"); },
              function(err) { console.error("Error signing in", err); });
  }
  function loadClient() {
    gapi.client.setApiKey("YOUR_API_KEY");
    return gapi.client.load("https://content.googleapis.com/discovery/v1/apis/admin/directory_v1/rest")
        .then(function() { console.log("GAPI client loaded for API"); },
              function(err) { console.error("Error loading GAPI client for API", err); });
  }
  // Make sure the client is loaded and sign-in is complete before calling this method.
  function execute() {
    return gapi.client.directory.users.get({
      "userKey": "<user email address>"
    })
        .then(function(response) {
                // Handle the results here (response.result has the parsed body).
                console.log("Response", response);
              },
              function(err) { console.error("Execute error", err); });
  }
  gapi.load("client:auth2", function() {
    gapi.auth2.init({client_id: "YOUR_CLIENT_ID"});
  });`

Also I recommend you to to use the Quickstart to get more familiar about how to use the Google API's.

Just check for user's Google organization in JavaScript and then display content?

1 Answers1