在 Herokuapp 中对节点服务器进行 React Fetch

Question

I'm attempting to fetch data from my node.js server (which is on port 7000) through react in heroku with this code:

const { name } = e.target.elements;
        let details = {
            name: name.value,
        };
        let response = await fetch("/post", {
            method: "POST",
            headers: {
                "Content-Type": "application/json;charset=utf-8",
            },
            body: JSON.stringify(details),
        });

and this server setup:

if(process.env.NODE_ENV === "production") {
    app.use(express.static('../client/build'));
    app.get('*', (req, res) => {
        req.sendFile(path.resolve('client/build/index.html', { root: "../" }));
    });
}

app.post("/post", async (req, res) => {
    const queryRes = await searchFromQuery(req.body.name);

    res.json({
        status: queryRes.isFound ? "found" : "notFound", teaminfo: {
            name: queryRes.name,
            number: queryRes.number,
            avgScore: queryRes.avgScore,
            predictedScore: queryRes.predictedScore,
        }
    });
});

app.listen(PORT, console.log(`Server started on port ${PORT}`));

app.get("/", function(req, res) {
    res.sendFile('client/build/index.html', { root: "../" });
});

However, when I print out req there doesn't seem to be any data related to the react request. I believe it has to do with my express setup (which I set to express.static() for heroku, though it was initially express.json())

Additionally, the proxy in my package.json is still set to http://localhost:7000 .

Answer 1

Issue resolved by adding app.use(express.json()) back to the server file alongside static.