@kiyasov/apollo-multi-endpoint-link
v2.8.3
Published
Apollo link which add an api directive to fetch data from multi endpoints
Downloads
4
Readme
Apollo link which add an api directive to fetch data from multi endpoints
Why ?
We wrote an article about why and how we did this link if you want more details.
Install
npm i @habx/apollo-multi-endpoint-link
Setup
import { createHttpLink } from "apollo-link-http";
new ApolloClient({
link: ApolloLink.from([
new MultiAPILink({
endpoints: {
housings: 'https://housings.api',
projects: 'https://projects.api',
...
},
createHttpLink: () => createHttpLink(),
}),
])
})
NB: Since default value of httpSuffix
is /graphql
, endpoints above will be transformed to https://housings.api/graphql
and https://projects.api/graphql
.
If you do not have common suffix, you can pass an empty string as httpSuffix
to avoid this transformation.
NB 2: Supports apollo-link-rest library
API
new MultiAPILink(config, request);
config
| Parameter | Description | Default | Required |
| --------------- | -------------------------------------------------------------------------------------------------------------------------- | ---------------------- | -------- |
| endpoints | Dictionary of endpoints | | Yes |
| defaultEndpoint | Default endpoint | | No |
| createHttpLink | Function to generate http link like apollo-link-http | | Yes |
| createWsLink | Function to generate wsLink like apollo-link-ws | | No |
| wsSuffix | Suffix added to endpoint for subscriptions queries | /graphql/subscriptions | No |
| httpSuffix | Suffix added to endpoint for http queries | /graphql | No |
| getContext | Callback function called to set custom context like headers | | No |
| prefixTypenames | Add name argument passed in @api
directive to every __typename contained in network data response | | No |
Queries
Query with static api name :
query projectList($params: Params) @api(name: projects) {
projects(params: $params) {
nodes {
id
name
}
}
}
const response = useQuery(myQuery);
Query with dynamic api name
query projectList($params: Params) @api(contextKey: "apiName") {
projects(params: $params) {
nodes {
id
name
}
}
}
const response = useQuery(myQuery, { context: { apiName: "projects" } });
Setting custom context
Sometimes you might need to set custom apollo link context like headers
for authentication purpose.
This link allows it by doing as following.
new MultiAPILink({
getContext: (endpoint) => {
if (endpoint === 'yourendpoint-with-auth') {
return ({
headers: {
'Authorization': 'xxxx',
}
})
}
return {}
},
...
})