The createHttpLink function is the primary factory method for creating HTTP transport links in Apollo Link chains. It provides comprehensive configuration options for customizing HTTP behavior and integrates seamlessly with Apollo Client.
Creates an Apollo Link instance configured for HTTP transport with customizable options.
/**
* Creates an HTTP transport link for GraphQL operations
* @param linkOptions - Configuration options for the HTTP link
* @returns ApolloLink instance configured for HTTP transport
*/
function createHttpLink(linkOptions?: HttpLink.Options): ApolloLink;Parameters:
linkOptions (optional): Configuration object extending HttpOptions with additional HTTP-specific optionsThe returned ApolloLink instance handles:
Usage Examples:
import { createHttpLink } from "apollo-link-http";
// Basic HTTP link with default GraphQL endpoint
const basicLink = createHttpLink();
// Uses default URI: '/graphql'
// HTTP link with custom endpoint
const customLink = createHttpLink({
uri: "https://api.example.com/graphql",
});
// HTTP link with authentication headers
const authLink = createHttpLink({
uri: "https://api.example.com/graphql",
headers: {
authorization: "Bearer your-token-here",
"X-Custom-Header": "custom-value",
},
});
// HTTP link with credential inclusion
const credentialLink = createHttpLink({
uri: "https://api.example.com/graphql",
credentials: "include", // 'omit', 'same-origin', or 'include'
});
// HTTP link using GET for queries
const getLink = createHttpLink({
uri: "https://api.example.com/graphql",
useGETForQueries: true, // Queries use GET, mutations use POST
});
// HTTP link with custom fetch implementation
const customFetchLink = createHttpLink({
uri: "https://api.example.com/graphql",
fetch: customFetch, // Custom fetch function
fetchOptions: {
timeout: 5000,
// Additional fetch options
},
});
// HTTP link with dynamic URI resolution
const dynamicUriLink = createHttpLink({
uri: (operation) => {
// Select URI based on operation
if (operation.operationName === "AdminQuery") {
return "https://admin-api.example.com/graphql";
}
return "https://api.example.com/graphql";
},
});The HTTP link integrates with Apollo Link's context system for per-operation customization:
// Per-operation header customization
const result = await client.query({
query: MY_QUERY,
context: {
headers: {
"X-Request-ID": "unique-id-123",
},
// Override URI for this operation
uri: "https://special-api.example.com/graphql",
// Override fetch options
fetchOptions: {
timeout: 10000,
},
},
});Automatic client identification headers are added when clientAwareness is provided in context:
const result = await client.query({
query: MY_QUERY,
context: {
clientAwareness: {
name: "my-app",
version: "1.2.0",
},
},
});
// Automatically adds:
// apollographql-client-name: my-app
// apollographql-client-version: 1.2.0