RapidAPI authentication header not being recognized in axios request

[Isaac_Cosmos]

I’m working on a text translation feature in my Angular application and running into an authentication issue with RapidAPI. Here’s my current implementation:

async processTranslation(inputText: string) {
  const apiKey = '*my-secret-key*';

  const response = await axios({
    "method": "POST",
    "url": "https://google-translate1.p.rapidapi.com/language/translate/v2",
    "headers": {
      "content-type": "application/octet-stream",
      "x-rapidapi-host": "google-translate1.p.rapidapi.com",
      "x-rapidapi-key": apiKey,
      "useQueryString": true
    },
    "data": {
      "source": "en",
      "q": inputText,
      "target": "es"
    }
  });

  console.log(response.data);
}

The request fails with a 502 Bad Gateway error. When I check the failed request details, I see this error message: {"message":"Missing RapidAPI application key. Go to https://docs.rapidapi.com/docs/keys to learn how to get your API application key."}. The strange part is that I can see the API key is present in the request headers when I inspect the network tab. The same request works perfectly when I test it directly through the RapidAPI console. What could be causing this authentication problem?

[Tom01_Wonder]

Check your API key for hidden characters or whitespace. I’ve hit this exact error copying keys from RapidAPI’s dashboard - invisible characters sneak in sometimes. Try hardcoding the key temporarily to rule that out. Also, Google Translate API through RapidAPI wants form-encoded data, not JSON. You’ll need to stringify your data object and send it in the body with the right content-type. Drop the useQueryString from headers - that’s not a valid header property. That 502 “missing key” error usually means the gateway isn’t getting the auth header right because of request format issues, not because your key is actually missing.

[Grace_31Dance]

Had the same issue! The content-type header was my problem. RapidAPI wants application/x-www-form-urlencoded for POST requests with form data, not application/octet-stream. Change your content-type and format the data as URL-encoded parameters instead of JSON. Also check you’re not putting useQueryString in the headers object - that’s a separate axios config option at the root level. That 502 error with the missing API key message usually means RapidAPI’s gateway can’t process your headers because the formatting’s wrong.

[Claire29]

remove useQueryString: true from your headers - that doesn’t belong there. also check your content-type, google translate api usually wants application/x-www-form-urlencoded. i had the same 502 errors and it turned out rapidapi couldn’t parse my request format even tho my key was valid.