我的 react apollo 应用程序在本地运行，但不在 heroku 上运行

如何解决我的 react apollo 应用程序在本地运行，但不在 heroku 上运行

我在部署时遇到 GET query missing 错误。

Heroku 错误日志：

heroku[router]: at=info method=GET path="/" host=cook-it-sw.herokuapp.com request_id=bc5296e8-6955-4d3e-ab28-368e10f18bcb fwd="108.35.246.208" dyno=web.1 connect=0ms service=4ms status=400 bytes=236 protocol=https

这是我的文件结构，

enter image description here

root/client/package.json 的内容

{
  "name": "merng","version": "1.0.0","description": "","main": "server.js","scripts": {
    "serve": "nodemon server","start": "node server"
  },"keywords": [],"author": "","license": "ISC","dependencies": {
    "apollo-server": "^2.24.0","bcryptjs": "^2.4.3","csvtojson": "^2.0.10","dotenv": "^10.0.0","graphql": "^14.3.1","jsonwebtoken": "^8.5.1","mongoose": "^5.12.7","path": "^0.12.7","react-router-dom": "^5.0.1","semantic-ui-css": "^2.4.1","semantic-ui-react": "^0.87.2"
  },"devDependencies": {
    "nodemon": "^1.19.1"
  }
}

root/client/server.js 的内容

const { ApolloServer } = require('apollo-server');
const mongoose = require('mongoose');

const typeDefs = require('./graphql/typeDefs');
const resolvers = require('./graphql/resolvers');
const { MONGODB } = require('./config.js');


const ports = process.env.PORT || 5000;

const server = new ApolloServer({
  typeDefs,resolvers,context: ({ req }) => ({ req })
});

mongoose
  .connect(MONGODB,{ useNewUrlParser: true,useCreateIndex: true,useFindAndModify: false,useUnifiedTopology: true })
  .then(() => {
    console.log('MongoDB Connected');
    return server.listen({ port: ports });
  })
  .then((res) => {
    console.log(`Server running at ${res.url}`);
  });

root/client/src/index.js 的内容

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './components/App';
import 'antd/dist/antd.css';
import { ApolloProvider } from '@apollo/react-hooks';
import ApolloClient from 'apollo-client';
import { InMemoryCache } from 'apollo-cache-inmemory';
import { createHttpLink } from 'apollo-link-http';
import { setContext } from 'apollo-link-context';
import { AuthProvider } from './context/auth';
import 'semantic-ui-css/semantic.min.css'
const httpLink = createHttpLink({
    uri: 'http://localhost:5000/'
});

const authLink = setContext(() => {
    const token = localStorage.getItem('jwtToken');
    return {
        headers: {
            Authorization: token ? `Bearer ${token}` : ''
        }
    };
});

const client = new ApolloClient({
    link: authLink.concat(httpLink),cache: new InMemoryCache()
});




ReactDOM.render(

    <ApolloProvider client={client}>
        <AuthProvider>
            <App />
        </AuthProvider>
    </ApolloProvider>,document.getElementById('root')
);

root/client/package.json 的内容

{
  "name": "cook-it","version": "0.1.0","private": true,"dependencies": {
    "@apollo/react-hooks": "4.0.0","@material-ui/core": "4.11.3","@material-ui/lab": "4.0.0-alpha.57","@testing-library/jest-dom": "5.11.9","@testing-library/react": "11.2.5","@testing-library/user-event": "12.8.0","add": "2.0.6","antd": "4.15.0","apollo-cache-inmemory": "1.6.6","apollo-client": "2.6.10","apollo-link-context": "1.0.20","apollo-link-http": "1.5.17","body-parser": "^1.19.0","firebase": "8.3.1","graphql": "15.5.0","graphql-tag": "2.11.0","jwt-decode": "3.1.2","react": "17.0.1","react-bootstrap": "1.5.1","react-dom": "17.0.1","react-router-dom": "5.2.0","react-scripts": "4.0.3","semantic-ui-css": "2.4.1","semantic-ui-react": "2.0.3","web-vitals": "1.1.0","yarn": "^1.22.10"
  },"scripts": {
    "start": "react-scripts start","build": "react-scripts build","test": "react-scripts test","eject": "react-scripts eject"
  },"eslintConfig": {
    "extends": [
      "react-app","react-app/jest"
    ]
  },"browserslist": {
    "production": [
      ">0.2%","not dead","not op_mini all"
    ],"development": [
      "last 1 chrome version","last 1 firefox version","last 1 safari version"
    ]
  }
}

我数小时以来一直试图修复此错误，但没有任何效果。如果有人能在这里帮助我，我将不胜感激。我想这个错误主要是由于 express 和 apollo 造成的，但我无法弄清楚要更改哪些内容。