Error: called start() with surprising state started

[jimfilippou]

Hello, I am using nextjs with apollo-server-micro and my code for initiating the server looks like this

const GraphQLServer = new ApolloServer({
    schema: GraphQLSchema.buildSchema(),
    introspection: true,
    plugins: [ApolloServerPluginLandingPageGraphQLPlayground()],
});

async function handler(req: NextApiRequest, res: NextApiResponse) {
    await GraphQLServer.start();
    await GraphQLServer.createHandler({ path: "/api/graphql", })(req, res);
}

export const config = {
    api: {
        bodyParser: false,
    },
};

export default withMongo(handler);

I get this error

I don't understand what surprising means, so could someone help me understand?
Thanks in advance

[jimfilippou]

I will answer my question for future viewers.

The problem with my code is that I am initializing the server on every request, and you can guess this can introduce many errors, one of which is the one I posted.

The solution is to use this code

const GraphQLServer = new ApolloServer({
    schema: GraphQLSchema.buildSchema(),
    introspection: true,
    plugins: [ApolloServerPluginLandingPageGraphQLPlayground()],
});
const startServer = GraphQLServer.start()

async function handler(req: NextApiRequest, res: NextApiResponse) {
    if (req.method === 'OPTIONS') {
        res.end();
        return false;
    }
    await startServer;
    await GraphQLServer.createHandler({ path: "/api/graphql", })(req, res);
}

export const config = {
    api: {
        bodyParser: false,
    },
};

export default withMongo(handler);

The real fix (other than some code improvements) is the fact that I initiate a single promise with calling GraphQLServer.start and then I am awaiting this single promise, I don't create others.

The promise lives there all alone, on it's own. Let's cheer the promise up, it's doing a great job keeping the server up!
Great job promise! 🥳

[glasser]

For what it's worth, there's no reason to use apollo-server-micro (the least featureful Apollo Server integration) with Next.JS, a project that does not use Micro. Perhaps someday the Next.js maintainers will merge my PR to switch off of apollo-server-micro and upgrade to AS3: vercel/next.js#30082

[programandoconro]

A little modification on the accepted answer.

import { ApolloServer } from "apollo-server-micro";
import { typeDefs } from "./schemas";
import { NextApiRequest, NextApiResponse } from "next";

const GraphQLServer = new ApolloServer({
  introspection: true,
  typeDefs,
});
const startServer = GraphQLServer.start();

async function handler(req: NextApiRequest, res: NextApiResponse) {
  if (req.method === "OPTIONS") {
    res.end();
    return false;
  }
  await startServer;
  await GraphQLServer.createHandler({ path: "/api/graphql" })(req, res);
}

export const config = {
  api: {
    bodyParser: false,
  },
};

export default handler;