javascript - Hur man får en autentiseringstoken för Google Cloud Translation API i webbläsaren (Chrome-tillägg)

Jag försöker skapa en Chrome-tillägg som använder Google Cloud Translation API. Jag följde en massa instruktioner på många olika sidor i dokumentationen för Google Translate och för att utveckla Chrome-tillägg, men jag kan fortfarande inte lista ut hur man faktiskt använder API:et från en webbläsare.

Det längsta jag har kommit var genom att följa en del av snabbstartsguiden där du skapar ett tjänstekonto, får en nyckelfil för tjänstekontot (nedladdad som en .json-fil), installerar och initierar Google SDK, ställer in miljövariabeln GOOGLE_APPLICATION_CREDENTIALS till sökvägen för servicekontots JSON-nyckelfil, och sedan gör en curl-förfrågan med gcloud auth application-default print-access-token för att få en åtkomsttoken som ska anges som en del av begäranshuvudet: "Authorization: Bearer (token här)". Lyckades hämta en översättning på det sättet.

Men inom miljön för ett tillägg kan du inte köra kommandon som gcloud, så det fungerar inte. Jag kunde manuellt hämta en åtkomsttoken med gcloud-kommandot och sedan klistra in den i min JavaScript-kod som en del av begärans header (t.ex. xmlHttpRequest.setRequestHeader('Authorization', 'Bearer ya29.c.Elr6BRuTfOtherRandomLetters');). Men den åtkomsttokenen går ut efter 60 minuter, så det fungerar inte hållbart.

Jag försökte också använda metoden identity.getAuthToken (efter att ha uppdaterat saker i manifest.json på det sätt som dokumentationen säger), men det fungerade inte. Att använda mitt servicekonto client ID som client_id under oauth2 i manifest.json resulterade i ett "Ogiltigt klient-ID"-fel från identity.getAuthToken. Å andra sidan, att generera ett OAuth2 Client ID från Google Console, och använda myoauth2clientid.apps.googleusercontent.com som client_id under oauth2 och ["https://www.googleapis.com/auth/cloud-translation", "https://www.googleapis.com/auth/cloud-platform"] som scopes under oauth2 resulterade i ett "OAuth2 inte beviljat eller återkallat"-fel från identity.getAuthToken.

Att generera en API-nyckel från Google Console-sidan och använda den direkt som key-parametern i min översättningsförfrågan fungerade inte ens: jag fick ett felmeddelande om att "Förfrågan saknar en giltig API-nyckel."

Jag är verkligen helt förlorad här. All hjälp skulle vara fantastiskt.

Svar #1

Jag (förstagångsposter) gick också igenom samma steg som du, men med hjälp av @magicnumber:s svar kom jag fram till en lösning för att översätta text (från vilket språk som helst till engelska) i mitt Chrome-tillägg med hjälp av en API-nyckel istället för en servicekonto-nyckelfil.

Skapa först en översättningsfunktion (jag använde Async -> Await-mönstret här):

 async function translate(strSourceText,strApiKey)
  {
    var url = `https://translation.googleapis.com/language/translate/v2?key=${strApiKey}`
    let response = await fetch(url, {
      method: 'POST',
      headers : { 
        'Content-Type': 'application/json',
       },
       body: JSON.stringify({
         target: "en",
         format: "text",
         q: strSourceText
       }),
    }); 
    let data = await response.json()
    return data;
  }

Anropa sedan den asynkrona funktionen som kommer att returnera ett löfte, t.ex.:

query="כלב" //Hebrew word for dog 🐶

translate(query,  "YOURVALIDAPIKEYGOESHERE")
  .then(response => console.log(response.data))
  .catch(reason => console.log(reason.message));

Svaret från Google Translate API ska se ut som:

{
  "data": {
    "translations": [
      {
        "translatedText": "Dog",
        "detectedSourceLanguage": "iw"
      }
    ]
  }
}

Slutligen, för att undvika att bryta mot Content Security Policy, i mitt fall, var jag tvungen att lägga till översättnings-API:ets domän till min behörighetsnyckel i manifest.json-filen för mitt tillägg:

"permissions": ["https://translation.googleapis.com/language/translate/v2/*"],

Svar #2

Jag gick igenom samma steg som du och kan inte heller lita på gcloud för autentisering.

Vad som fick mig förbi felet "Begäran saknar en giltig API-nyckel" var att använda frågesyntaxen som beskrivs här https://codelabs.developers.google.com/codelabs/cloud-translation-intro/index.html#5

I mitt fall använde jag:

curl -s -X POST -H "Content-Type: application/json" \
    --data "{
  'q': 'The Great Pyramid of Giza (also known as the Pyramid of Khufu or the
        Pyramid of Cheops) is the oldest and largest of the three pyramids in
        the Giza pyramid complex.',
  'source': 'en',
  'target': 'es',
  'format': 'text'
}" "https://translation.googleapis.com/language/translate/v2?key=YOURVALIDAPIKEYHERE"