Where to insert api key in apollo-server

Help
1

In lift off series we studying how to use RESTDataSorce with base url only, but in real world there is APIs that need an api key, i searched for answer but never got one that solves problem with using this key on apollo-server side, and not on client. All answers where outdated.
In docs i found this 2 snippets

class PersonalizationAPI extends RESTDataSource {
  willSendRequest(request) {
    request.params.set('api_key', this.context.token);
  }
}

class PersonalizationAPI extends RESTDataSource {
  willSendRequest(request) {
    request.headers.set('Authorization', this.context.token);
  }
}

Could someone consider showing me how to use API with a KEY?

P.S. Links to other resources would be amazing too

2

This is exactly how you use it. The only difference is the name.

API KEY is not a standard. There is no such thing as specification. You need to know HOW your REST API receives that key. Is it via the Authorization header?

Then that is how you do it:

class PersonalizationAPI extends RESTDataSource {
  willSendRequest(request) {
    request.headers.set('Authorization', this.context.token);
  }
}

Just replace this.context.token with your key.

The reason why the example uses the apollo server context is simple. Usually, you do not want to hardcore your API key because it might change and you don’t want to make changes to the source when someone replaces the token.

So you put it somewhere like an environment variable, then you load it on the app start into context. And you pass it to RESTDataSource. And data source pass it to each request like in the example.

1 Like
3

Thank you very much, this is the answer i was looking for, looks like i’m simply unfamiliar with the whole part of JS about fetching data.
Turned out for my api i was needed query parametr, instaled dotenv, created .env file and storing my key here from now on. Thank you again, u just opened eyes for me.

4

Check if that API has any other way to transfer the key. And if it’s your api I suggest changing that part from query parameter to headers/cookies. Query parameter is the WORST way you can do this. Because your typical HTTP server might log requests. So that means access keys might be stored in apache/nginx logs. Very bad idea. Anyone who has access to server would have access to those tokens.

Usually you want to have support for both cookies and http headers like Authorization.

Authorization header is a standard method. You want support for it simply because then another app can make a request to your app. And adding header to the request is usually rather simple.

You want http cookies because that is probably the safest method of keeping auth token in the client browser. HTTP only, secured cookies cannot be accessed by Javascript. But can be transferred to the backed when you make a request. So even if attacker for example use XSS to gain access to other users data he won’t be able to steal access tokens.

1 Like
5

Thank you very much, is there any resources like books or sites that you would recomend to learn basics of whole fetching thing and maybe best practices?
I’m learning whole graphql stuff based on coinmarket API, i tried both params and headers ways to fetch data and in api request logs there is api key showing when i’m using query parametrs. Tryed to use headers and there was no key showing. I’m stunned by this difference in safety.

6

You mean this?

https://coinmarketcap.com/api/documentation/v1/#section/Quick-Start-Guide

Even their quick start guide shows that you can use custom header. Header name is

X-CMC_PRO_API_KEY

It’s hard for me to recommend any books. I have over 10 years of experience. These days I mostly use documentations.

1 Like