How to use where clause in Knex
Create refunds with Stripe
Load HTML with Cheerio
How to send POST request with Axios
Find intersection of array in Lodash
Powered by Official white Bloop logo with a period

Terms / Privacy / Search / Support

  • const httpLink = createHttpLink({
      uri: "server.com/graphql",
    });
    const restLink = new RestLink({ uri: "api.server.com" });
    
    const client = new ApolloClient({
      cache: new InMemoryCache(),
      link: ApolloLink.from([
        authLink,
        restLink,
        errorLink,
        retryLink,
        httpLink,
      ]),
      // Note: httpLink is terminating so must be last, while retry & error wrap
      // the links to their right. State & context links should happen before (to
      // the left of) restLink.
    });
    
    Docs
    0
  • import {
      ApolloClient,
      createHttpLink,
      InMemoryCache,
    } from "@apollo/client";
    
    const client = new ApolloClient({
      ssrMode: true,
      link: createHttpLink({
        uri: "http://localhost:3010",
        credentials: "same-origin",
        headers: { cookie: req.header("Cookie") },
      }),
      cache: new InMemoryCache(),
    });
    
    Docs
    0
  • import {
      ApolloClient,
      createHttpLink,
      InMemoryCache,
    } from "@apollo/client";
    import { setContext } from "@apollo/client/link/context";
    
    const httpLink = createHttpLink({
      uri: "/graphql",
    });
    
    const authLink = setContext((_, { headers }) => {
      // get the authentication token from local storage if it exists
      const token = localStorage.getItem("token");
      // return the headers to the context so httpLink can read them
      return {
        headers: {
          ...headers,
          authorization: token ? `Bearer ${token}` : "",
        },
      };
    });
    
    const client = new ApolloClient({
      link: authLink.concat(httpLink),
      cache: new InMemoryCache(),
    });
    
    Docs
    0
  • const customFetch = (uri, options) => {
      const { operationName } = JSON.parse(options.body);
      return fetch(
        `${uri}/graph/graphql?opname=${operationName}`,
        options
      );
    };
    const link = createHttpLink({ fetch: customFetch });
    
    Docs
    0
  • const customFetch = (uri, options) => {
      const { header } = Hawk.client.header(
        "http://example.com:8000/resource/1?b=1&a=2",
        "POST",
        { credentials: credentials, ext: "some-app-data" }
      );
      options.headers.Authorization = header;
      return fetch(uri, options);
    };
    const link = createHttpLink({ fetch: customFetch });
    
    Docs
    0
  • import { ApolloLink } from "apollo-link";
    import { createHttpLink } from "apollo-link-http";
    const httpLink = createHttpLink({ uri: "/graphql" });
    const middlewareLink = new ApolloLink(
      (operation, forward) => {
        operation.setContext({
          headers: {
            authorization:
              localStorage.getItem("token") || null,
          },
        });
        return forward(operation);
      }
    );
    // use with apollo-client
    // use with apollo-client
    const link = middlewareLink.concat(httpLink);
    
    Docs
    0
  • import { ApolloLink } from "apollo-link";
    import { createHttpLink } from "apollo-link-http";
    const httpLink = createHttpLink({ uri: "/graphql" });
    const addDatesLink = new ApolloLink(
      (operation, forward) => {
        return forward(operation).map((response) => {
          if (response.data.user.lastLoginDate) {
            response.data.user.lastLoginDate = new Date(
              response.data.user.lastLoginDate
            );
          }
          return response;
        });
      }
    );
    // use with apollo-client
    // use with apollo-client
    const link = addDatesLink.concat(httpLink);
    
    Docs
    0
  • import { createHttpLink } from "apollo-link-http";
    import ApolloClient from "apollo-client";
    import { InMemoryCache } from "apollo-cache-inmemory";
    const client = new ApolloClient({
      link: createHttpLink({ uri: "/graphql" }),
      cache: new InMemoryCache(),
    });
    // a query with apollo-client
    // a query with apollo-client
    client.query({
      query: MY_QUERY,
      context: {
        // example of setting the headers with context per operation
        // example of setting the headers with context per operation
        headers: {
          special: "Special header value",
        },
      },
    });
    
    Docs
    0
  • import {
      ApolloClient,
      HttpLink,
      ApolloLink,
      InMemoryCache,
      from,
    } from "@apollo/client";
    
    const httpLink = new HttpLink({ uri: "/graphql" });
    
    const authMiddleware = new ApolloLink(
      (operation, forward) => {
        // add the authorization to the headers
        operation.setContext(({ headers = {} }) => ({
          headers: {
            ...headers,
            authorization:
              localStorage.getItem("token") || null,
          },
        }));
    
        return forward(operation);
      }
    );
    
    const activityMiddleware = new ApolloLink(
      (operation, forward) => {
        // add the recent-activity custom header to the headers
        operation.setContext(({ headers = {} }) => ({
          headers: {
            ...headers,
            "recent-activity":
              localStorage.getItem("lastOnlineTime") || null,
          },
        }));
    
        return forward(operation);
      }
    );
    
    const client = new ApolloClient({
      cache: new InMemoryCache(),
      link: from([
        authMiddleware,
        activityMiddleware,
        httpLink,
      ]),
    });
    
    Docs
    0
  • import { ApolloClient, InMemoryCache, HttpLink } from '@apollo/client';
    
    const client = new ApolloClient({
      cache: new InMemoryCache(),
      link: new HttpLink({ uri: 'http://localhost:4000/graphql' }),
    });
    
    client.setResolvers({ ... });
    Docs
    0
  • const customFetch = (uri, options) => {
      const { header } = Hawk.client.header(
        "http://example.com:8000/resource/1?b=1&a=2",
        "POST",
        { credentials: credentials, ext: "some-app-data" }
      );
      options.headers.Authorization = header;
      return fetch(uri, options);
    };
    
    const link = new HttpLink({ fetch: customFetch });
    
    Docs
    0
  • import { HttpLink } from "@apollo/client";
    
    const link = new HttpLink({ uri: "/graphql" });
    
    Docs
    0
  • import {
      ApolloClient,
      InMemoryCache,
      HttpLink,
    } from "@apollo/client";
    import { onError } from "@apollo/client/link/error";
    
    import { logout } from "./logout";
    
    const httpLink = new HttpLink({ uri: "/graphql" });
    
    const logoutLink = onError(({ networkError }) => {
      if (networkError.statusCode === 401) logout();
    });
    
    const client = new ApolloClient({
      cache: new InMemoryCache(),
      link: logoutLink.concat(httpLink),
    });
    
    Docs
    0
  • import { ApolloLink, from } from "@apollo/client";
    
    const timeStartLink = new ApolloLink(
      (operation, forward) => {
        operation.setContext({ start: new Date() });
        return forward(operation);
      }
    );
    
    const logTimeLink = new ApolloLink((operation, forward) => {
      return forward(operation).map((data) => {
        // data from a previous link
        const time = new Date() - operation.getContext().start;
        console.log(
          `operation ${operation.operationName} took ${time} to complete`
        );
        return data;
      });
    });
    
    const additiveLink = from([timeStartLink, logTimeLink]);
    
    Docs
    0
  • import { ApolloLink } from "@apollo/client";
    
    const authLink = new ApolloLink((operation, forward) => {
      operation.setContext(({ headers }) => ({
        headers: {
          authorization: Auth.userId(), // however you get your token
          ...headers,
        },
      }));
      return forward(operation);
    });
    
    Docs
    0
  • import { ApolloLink } from "@apollo/client";
    
    const consoleLink = new ApolloLink((operation, forward) => {
      console.log(
        `starting request for ${operation.operationName}`
      );
      return forward(operation).map((data) => {
        console.log(
          `ending request for ${operation.operationName}`
        );
        return data;
      });
    });
    
    Docs
    0
  • import {
      ApolloClient,
      InMemoryCache,
      HttpLink,
      ApolloLink,
    } from "@apollo/client";
    import { asyncMap } from "@apollo/client/utilities";
    
    import { usdToEur } from "./currency";
    
    const httpLink = new HttpLink({ uri: "/graphql" });
    
    const usdToEurLink = new ApolloLink(
      (operation, forward) => {
        return asyncMap(
          forward(operation),
          async (response) => {
            let data = response.data;
            if (data.price && data.currency === "USD") {
              data.price = await usdToEur(data.price);
              data.currency = "EUR";
            }
            return response;
          }
        );
      }
    );
    
    const client = new ApolloClient({
      cache: new InMemoryCache(),
      link: usdToEurLink.concat(httpLink),
    });
    
    Docs
    0
  • import { ApolloLink } from "@apollo/client";
    
    const roundTripLink = new ApolloLink(
      (operation, forward) => {
        // Called before operation is sent to server
        operation.setContext({ start: new Date() });
    
        return forward(operation).map((data) => {
          // Called after server responds
          const time =
            new Date() - operation.getContext().start;
          console.log(
            `Operation ${operation.operationName} took ${time} to complete`
          );
          return data;
        });
      }
    );
    
    Docs
    0
  • const authRestLink = new ApolloLink(
      (operation, forward) => {
        operation.setContext(({ headers }) => {
          const token = localStorage.getItem("token");
          return {
            headers: {
              ...headers,
              Accept: "application/json",
              Authorization: token,
            },
          };
        });
        return forward(operation).map((result) => {
          const { restResponses } = operation.getContext();
          const authTokenResponse = restResponses.find((res) =>
            res.headers.has("Authorization")
          );
          // You might also filter on res.url to find the response of a specific API call
          if (authTokenResponse) {
            localStorage.setItem(
              "token",
              authTokenResponse.headers.get("Authorization")
            );
          }
          return result;
        });
      }
    );
    
    const restLink = new RestLink({ uri: "uri" });
    
    const client = new ApolloClient({
      cache: new InMemoryCache(),
      link: ApolloLink.from([authRestLink, restLink]),
    });
    
    Docs
    0
  • const httpLink = createHttpLink({
      uri: "server.com/graphql",
    });
    const restLink = new RestLink({ uri: "api.server.com" });
    
    const client = new ApolloClient({
      cache: new InMemoryCache(),
      link: ApolloLink.from([
        authLink,
        restLink,
        errorLink,
        retryLink,
        httpLink,
      ]),
      // Note: httpLink is terminating so must be last, while retry & error wrap
      // the links to their right. State & context links should happen before (to
      // the left of) restLink.
    });
    
    Docs
    0
  • Powered by Official black Bloop logo with a period
    download the IDE extension

    View other examples