Implementing GraphQL Server Authorization with JWT

Let’s consider a simple example using Apollo Server (a popular GraphQL server implementation) and jsonwebtoken library for JWT operations.

Server-side Implementation

const { ApolloServer, AuthenticationError } = require('apollo-server');
const jwt = require('jsonwebtoken');

// Mock user data (for demonstration purposes)
const users = [
  { id: '1', username: 'john_doe', role: 'admin' }
];

const SECRET_KEY = 'mysecretkey';

const typeDefs = `
  type Query {
    currentUser: User
  }

  type User {
    id: ID!
    username: String!
    role: String!
  }
`;

const resolvers = {
  Query: {
    currentUser: (parent, args, context) => {
      // Check if user is authenticated
      if (!context.user) {
        throw new AuthenticationError('You must be logged in to access this resource');
      }
      return context.user;
    }
  }
};

const server = new ApolloServer({
  typeDefs,
  resolvers,
  context: ({ req }) => {
    const token = req.headers.authorization || '';
    if (!token) return {};

    try {
      const decoded = jwt.verify(token, SECRET_KEY);
      const user = users.find(u => u.id === decoded.userId);
      return { user };
    } catch (error) {
      throw new AuthenticationError('Invalid or expired token');
    }
  }
});

server.listen().then(({ url }) => {
  console.log(`Server running at ${url}`);
});

Dependencies:

The code imports necessary modules from the apollo-server package (ApolloServer and AuthenticationError) for setting up the GraphQL server, and jsonwebtoken for handling JSON Web Tokens.

Mock User Data:

users: This array stores mock user data for demonstration purposes. Each user object contains an id, username, and role. In a real-world scenario, this data would typically be retrieved from a database.

Secret Key:

SECRET_KEY: This variable holds a secret key used for signing and verifying JWT tokens. It’s crucial for ensuring the security of the tokens. In a production environment, this key should be securely stored and not exposed publicly.

Type Definitions (typeDefs):

Defines a GraphQL schema with a single query type (Query) and a custom User type. The User type has fields for id, username, and role.

Resolvers (resolvers):

Defines resolver functions for the GraphQL schema. In this code, there’s a resolver for the currentUser query. When this query is executed, the resolver checks if there’s a user object in the context. If not, it throws an AuthenticationError. If the user is authenticated, it returns the user object from the context.

Apollo Server Configuration:

Creates an Apollo Server instance with the provided type definitions (typeDefs), resolvers (resolvers), and a context function.

The context function extracts the JWT token from the request headers (req.headers.authorization) and verifies it using the jsonwebtoken library. If the token is valid, it retrieves the user object from the users array based on the decoded user ID and adds it to the context. If the token is invalid or expired, it throws an AuthenticationError.

Server Initialization:

Starts the Apollo Server, which listens on a specified port for incoming GraphQL requests. Once the server is running, it logs the server URL to the console.

This code sets up a GraphQL server with authentication using JWT tokens. It demonstrates how to authenticate users and protect resources by checking for authentication in resolver functions.

Client-side Example (Sending Authorization Header)

const { ApolloClient, InMemoryCache, createHttpLink } = require('@apollo/client');
const { setContext } = require('@apollo/client/link/context');

const httpLink = createHttpLink({
  uri: 'http://localhost:4000/graphql'
});

const authLink = setContext((_, { headers }) => {
  const token = localStorage.getItem('token');
  return {
    headers: {
      ...headers,
      authorization: token ? `Bearer ${token}` : ''
    }
  };
});

const client = new ApolloClient({
  link: authLink.concat(httpLink),
  cache: new InMemoryCache()
});

Dependencies:

• The code imports necessary modules from the @apollo/client package, including ApolloClient, InMemoryCache, createHttpLink, and setContext. These modules are essential for setting up an Apollo Client to interact with a GraphQL server.

HTTP Link Creation:

• createHttpLink: This function creates an HTTP link to the GraphQL server. It takes an object as an argument, where uri specifies the URL of the GraphQL server (http://localhost:4000/graphql in this case).

Authorization Link Creation:

• setContext: This function allows you to create a middleware link that modifies the request context before each GraphQL request is sent. It takes a function as an argument, which receives the GraphQL operation and context as parameters.
• Inside the function, it retrieves the JWT token from the local storage (localStorage.getItem(‘token’)).
• It then returns an object with the updated request headers, including the authorization header with the JWT token (if available), formatted as Bearer ${token}.

Apollo Client Configuration:

• ApolloClient: This class is used to instantiate a new Apollo Client, which serves as the interface for sending GraphQL queries and mutations to the server.
• It takes an object as an argument with the following properties:
• link: This property specifies the link chain to be used for sending requests. In this case, it concatenates the authorization link (authLink) with the HTTP link (httpLink) using the concat method.
• cache: This property specifies the cache implementation to be used by the client. In this example, it uses InMemoryCache, which caches query results in memory.

In the world of GraphQL, securing your server and implementing authorization mechanisms are critical aspects of building robust and secure APIs. JSON Web Tokens (JWT) provide a powerful method for handling authentication and authorization in GraphQL servers. This article will delve into the concepts of GraphQL server authorization with JWT, covering the implementation steps, benefits, and providing beginner-friendly examples with outputs to illustrate each concept clearly.