从浏览器连接到 apollo graphQL 服务器时出现 404 错误

Question

我在 nodejs 中设置了 apollo graphql 服务器。下面是源代码。我可以启动服务器，它开始侦听端口 6000。但是当我在浏览器中打开 url (http://localhost:6000/graphiql) 时，我得到了 This site can’t be reached。我想知道我的代码有什么问题。

const express = require('express');
const bodyParser = require('body-parser');
const { graphqlExpress, graphiqlExpress } = require('apollo-server-express');
const { makeExecutableSchema } = require('graphql-tools');

// Some fake data
const books = [
  {
    title: "Harry Potter and the Sorcerer's stone",
    author: 'J.K. Rowling',
  },
  {
    title: 'Jurassic Park',
    author: 'Michael Crichton',
  },
];

// The GraphQL schema in string form
const typeDefs = `
  type Query { books: [Book] }
  type Book { title: String, author: String }
`;

// The resolvers
const resolvers = {
  Query: { books: () => books },
};

// Put together a schema
const schema = makeExecutableSchema({
  typeDefs,
  resolvers,
});

// Initialize the app
const app = express();

// The GraphQL endpoint
app.use('/graphql', bodyParser.json(), graphqlExpress({ schema }));

// GraphiQL, a visual editor for queries
app.use('/graphiql', graphiqlExpress({ endpointURL: '/graphql' }));

// Start the server
app.listen(6000, () => {
  console.log('Go to http://localhost:6000/graphiql to run queries!');
});

Answer 1

这是一个端口问题，端口 6000 是大多数浏览器认为不安全的端口之一，即使您可以在终端上卷曲它。例如，这应该有效：

curl -X POST http://localhost:6000/graphql \
-H "Content-Type: application/json" \
-d '{"query": "{ books { title } }"}'

但是运行它在浏览器上不应该，因为端口是受限制的。你可以在Chrome and Firefox上看到限制端口列表，其他浏览器也应该遵循这个规则。

如果您将端口更改为 4000（例如，或任何其他不受限制的端口），一切都应该可以正常工作。

从浏览器连接到 apollo graphQL 服务器时出现 404 错误

Get 404 error when connecting to apollo graphQL server from browser

graphql

apollo-server