首页 > 解决方案 > 从浏览器连接到 apollo graphQL 服务器时出现 404 错误

问题描述

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

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!');
});

标签: graphqlapollo-server

解决方案


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

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

但是不应该在浏览器上运行它,因为端口受到限制。您可以在ChromeFirefox上查看受限端口列表,其他浏览器也应遵循此规则。

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


推荐阅读