How to get an authentication token for Google Cloud Translation API within browser (chrome extension)

I’m trying to make a Chrome extension that uses the Google Cloud Translation API. I followed a bunch of instructions on many different pages in the docs for Google Translate and for developing Chrome extensions but I still can’t figure out how to actually use the API from within a Browser.

The farthest I’ve gotten was from following part of the Quickstart guide where you create a service account, get a service account key file (downloaded as a .json file), install and initialize the Google SDK, set the GOOGLE_APPLICATION_CREDENTIALS environment variable to the path of the service account JSON key file, and then make a curl request using gcloud auth application-default print-access-token to get an access token to be inputted as part of the request header: “Authorization: Bearer (token here)”. Successfully retrieved a translation that way.

But within the environment of an extension you can’t run commands like gcloud so that doesn’t work. I was able to manually retrieve an access token using the gcloud command, and then paste that into my javascript code as part of the request header (e.g. xmlHttpRequest.setRequestHeader('Authorization', 'Bearer ya29.c.Elr6BRuTfOtherRandomLetters');). But that access token expires after 60 minutes so that doesn’t sustainably work.

I also tried using the identity.getAuthToken method (after updating things in manifest.json the way the documentation says to), but that didn’t work. Using my service account client ID as the client_id under oauth2 in manifest.json resulted in an “Invalid client ID” error from identity.getAuthToken. On the other hand, generating an OAuth2 Client ID from Google Console, and using myoauth2clientid.apps.googleusercontent.com as the client_id under oauth2 and ["https://www.googleapis.com/auth/cloud-translation", "https://www.googleapis.com/auth/cloud-platform"] as the scopes under oauth2 resulted in an “OAuth2 not granted or revoked” error from identity.getAuthToken.

Generating an API key from the Google Console page, and using that directly as the key parameter of my translation query, didn’t even work: I received a “The request is missing a valid API key.” error.

I am really at a loss here. Any help would be awesome.

Google translate chrome extention widget is dislocation

Just as image:

enter image description here

The other info:

Mac OS X 10.12
Chrome 61.0.3163.100