Apollo Angular HTTP Link

1.11.0 · abandoned · verified Wed Apr 22

apollo-angular-link-http is an Apollo Link implementation designed for Angular applications to facilitate sending GraphQL operations over standard HTTP requests. This package leverages Angular's `HttpClient` (`@angular/common/http`) for network communication. While its last stable version, `1.11.0`, was released over three years ago, its core functionality for creating an HTTP link has largely been integrated and superseded by the primary `apollo-angular` package. As such, `apollo-angular-link-http` is now considered abandoned. Modern Angular and Apollo setups typically configure `HttpLink` directly through `apollo-angular`'s `ApolloClient` creation process, often utilizing `provideApollo()` for dependency injection. This package previously served as a distinct module for HTTP-based GraphQL communication before the `apollo-angular` ecosystem evolved to incorporate this functionality directly.

Common errors

Warnings

Install

Imports

Quickstart

Demonstrates setting up `apollo-angular-link-http` in an Angular `NgModule`, configuring `HttpLink` with a URI and headers, and executing a simple GraphQL query with operation-specific context. Note that this setup relies on older Angular module patterns.

import { NgModule } from '@angular/core';
import { HttpClientModule, HttpHeaders } from '@angular/common/http';
import { ApolloModule, Apollo } from 'apollo-angular';
import { HttpLinkModule, HttpLink } from 'apollo-angular-link-http';
import { InMemoryCache } from '@apollo/client/core'; // From @apollo/client
import { gql } from 'graphql-tag'; // For defining GraphQL queries

const MY_QUERY = gql`
  query MyQuery($id: ID!) {
    item(id: $id) {
      name
      description
    }
  }
`;

@NgModule({
  imports: [HttpClientModule, ApolloModule, HttpLinkModule],
  // ... other module configurations
})
class AppModule {
  constructor(apollo: Apollo, httpLink: HttpLink) {
    apollo.create({
      link: httpLink.create({
        uri: '/graphql',
        includeExtensions: false,
        headers: new HttpHeaders().set('Authorization', 'Bearer ' + (process.env.AUTH_TOKEN ?? '')),
      }),
      cache: new InMemoryCache(),
    });

    // Example of executing a query with context
    apollo.query({
      query: MY_QUERY,
      variables: { id: '123' },
      context: {
        headers: new HttpHeaders().set('X-Custom-Header', 'custom-value'),
      },
    }).subscribe({
      next: ({ data, loading }) => {
        console.log('Query data:', data);
        console.log('Loading:', loading);
      },
      error: (error) => {
        console.error('Query error:', error);
      }
    });
  }
}

view raw JSON →