Question

我想做的是将react / apollo服务器全栈应用程序部署到heroku。因此，我试图从express / apollo-server后端提供静态客户端文件，如下所示：

const path = require('path');

const express = require('express');
const app = express();
const cors = require('cors');
const { ApolloServer } = require('apollo-server');

const { schema } = require('./schema');
const { resolvers } = require('./resolvers');

app.use(cors());

app.use(express.static('public'));

app.get('*', (req, res) => {
  res.sendFile(path.resolve(__dirname, 'public', 'index.html'));
});

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

server.listen({ port: process.env.PORT || 4000 }).then(({ url }) => {
  console.log(`?  Server ready at ${url}`);
});

出于某种原因，我不知道在部署到heroku时不为客户端提供服务。在heroku URL上，我得到：GET query missing.如果在生产中将graphql设置为enabled，我可以看到它，那么我就可以解析数据了。但是没有渲染客户端。我使用*的app.get无法正常工作，然后未捕获index.html。

我该如何解决？

谢谢！

Answer 1

您得到的错误是因为您只将server的{{1}}暴露给端口4000，而没有暴露ApolloServer的前端客户端应用程序。

为了部署全栈应用程序，还必须公开app，以便可以使用app中的applyMiddleware并绑定阿波罗服务器和前端客户端，例如：

ApolloServer

现在，您应该可以导航到..... app.get('*', (req, res) => { res.sendFile(path.resolve(__dirname, 'public', 'index.html')); }); const server = new ApolloServer({ typeDefs: schema, resolvers, }); server.applyMiddleware({ path: '/my-frontend', // you should change this to whatever you want app, }); app.listen({ port: process.env.PORT || 4000 }, () => { console.log(`? Server ready at http://localhost:4000`); });并查看您的客户端应用程序。

希望有帮助。

将React / Apollo服务器应用程序部署到Heroku

1 个答案: