Question

点击按钮后，我正在使用React和Express尝试将文章发布到MongoDB。

**server.js**

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

app.post("/articles/:id", function(request, response){
    console.log(request.body);
});

和

**home.jsx**

addToFavorites = article => {
    console.log(article);
    this.state.savedArticles.push(article);
    this.setState(this.state.savedArticles);

    axios.post("/articles/" + article.id, {
        title: article.title,
        summary: article.summary,
        writer: article.writer,
        date: article.pub_date,
        url: article.link
    })
    .then(function (response) {
        console.log(response);
    })
    .catch(function (error) {
        console.log(error);
    });
}

控制台将打印出该文章，因此它不是未定义的，并且该调用捕获以下错误：

Error: Request failed with status code 404
    at createError (createError.js:17)
    at settle (settle.js:19)
    at XMLHttpRequest.handleLoad (xhr.js:78)

在阅读其他文章时，人们提到该路径不存在，但是我不确定这意味着什么。

任何帮助将不胜感激：）

更新：

我的主要问题是，我在启动纱线之前没有运行节点server.js。我是React的新手，所以我不知道这很重要。

在package.json中包含代理也很重要。

Answer 1

如果您在端口8080上运行快递服务器，然后在package.json中添加以下行

"proxy": "http://localhost:8080"

Answer 2

您可以创建生产版本，而不是在开发版本中工作。与非常紧凑，经过压缩以提供更好的用户体验和在UI上加载的生产版本相比，在UI上呈现开发构建js文件要花费很多时间。在生产模式下，代码在您的客户端计算机上运行，因此这使得在最终用户的浏览器上呈现文件非常快速，并提高了性能。

从开发版本更改为生产版本的步骤：

在终端中按ctrl + c退出开发版本。
在项目目录中，要创建生产版本，请使用npm run build。
成功编译以上命令后，使用serve -s build部署静态服务器。

如果您在终端中看到此输出

│ Serving! │ │ │ │ - Local: http://localhost:5000 │ │ - On Your Network: http://172.16.2.1:5000 │ │ │

您已经成功编译了生产版本！

我的Axios调用返回了404错误React / Express

2 个答案: