Apollo Server + expressMiddleware setup for subscriptions over HTTP

[yorkeJohn]

I cannot seem to find the proper setup for using the new Apollo 4 subscriptions over HTTP with Apollo Server & Express. It does not seem to work out of the box, but I have no idea what additional configuration I need.

[sunnypatell]

@yorkeJohn apollo server 4 doesn't support HTTP multipart subscriptions on its own. the HTTP multipart subscription protocol is only handled by Apollo Router in federated setups.

for a standalone apollo server 4 with expressMiddleware, the supported approach is WebSocket subscriptions via graphql-ws. here's the setup:

import { createServer } from 'http';
import { WebSocketServer } from 'ws';
import { useServer } from 'graphql-ws/lib/use/ws';
import { ApolloServerPluginDrainHttpServer } from '@apollo/server/plugin/drainHttpServer';

const httpServer = createServer(app);
const wsServer = new WebSocketServer({ server: httpServer, path: '/graphql' });
const serverCleanup = useServer({ schema }, wsServer);

const server = new ApolloServer({
  schema,
  plugins: [
    ApolloServerPluginDrainHttpServer({ httpServer }),
    {
      async serverWillStart() {
        return { async drainServer() { await serverCleanup.dispose(); } };
      },
    },
  ],
});

the apollo server subscriptions guide has a full working example with context and auth handling. if you're looking at the callback-based ApolloServerPluginSubscriptionCallback, that one requires Apollo Router in front of your subgraph.