2022年如何使用apollo server express打开graphql游乐场页面？

Question

We have a API project using express with Apollo server express and graphql, I am new to graphql so I don't know how to land graphql playground page by default. when I am trying to run it lands on "http://localhost:8080/graphql but it shows

The full landing page can not be loaded; it appears that you might be offline

can any one help me how to land graphql playground page?

I have followed the below code

const express = require('express');
const { ApolloServer, gql } = require('apollo-server-express');


const typeDefs = gql`
  type Query {
    hello: String
  }
`;

const resolvers = {
  Query: {
    hello: () => 'Hello world!',
  },
};

const server = new ApolloServer({ typeDefs, resolvers });

const app = express();
server.applyMiddleware({ app });

const port = 8080;

app.listen({ port }, () =>
  console.log(`🚀 Server ready at http://localhost:${port}${server.graphqlPath}`),
);

Answer 1

Install apollo-server-core and add {ApolloServerPluginLandingPageGraphQLPlayground} it from the plugin section

source https://www.apollographql.com/docs/apollo-server/api/plugin/landing-pages/