axios > Express.router – Update(.put) 方法返回 404

Question

我正在尝试完成构建我的应用程序的最后一个 CRUD 方法。 （C、R 和 D）全部完成。但是更新似乎很麻烦。我有一个函数，它将对象 ID 与要更新的新内容结合起来。我正在
Error: Request failed with status code 404
打印到控制台。

我认为我无法使用 ID 访问数据库项目。

收集数据并发起请求的函数

  handleClick(e) {
    e.preventDefault()
    const data = {
      id: this.props.sid, //someuniqueid
      body: {
        name: this.state.name, //foo
        details: this.state.details, //bar
        content: this.state.content, //baz
      },
    }
    api
      .updateSnippet(data)
      .then(result => {
        this.setState({
          name: '',
          details: '',
          content: '',
          message: `'${this.state.name}' has been created`,
        })
        setTimeout(() => {
          this.setState({
            message: null,
          })
        }, 2000)
        console.log('UPDATE DATA SUCCESS!')
      })
      .catch(err => this.setState({ message: err.toString() }))
  }

api.js - 使用 axios 触发请求（这可能是我失败的地方）。

import axios from 'axios'

const service = axios.create({
  baseURL:
    process.env.NODE_ENV === 'production'
      ? '/api'
      : 'http://localhost:5000/api',
  withCredentials: true,
})

const errHandler = err => {
  console.error(err)
  if (err.response && err.response.data) {
    console.error('API response', err.response.data)
    throw err.response.data.message
  }
  throw err
}

export default {
  service: service,

  updateSnippet(data) {
    console.log(data.id) //someuniqueid
    console.log(data.body) //{name: "foo", details: "bar", content: "baz"}
    return service
      .put('/snippets' + data.id, {
        data: data.body,
      })
      .then(res => res.data)
      .catch(errHandler)
  },

}

Snippet.js（架构）

const mongoose = require('mongoose')

const snippetSchema = new mongoose.Schema({
  name: {
    type: String,
    required: [true, 'The snippet name is required'],
    minlength: 1,
  },
  details: {
    type: [String],
    default: [],
  },
  content: {
    type: String,
  },
})

const Snippet = mongoose.model('Snippet', snippetSchema)

module.exports = Snippet

“routes/sn-ps.js”中的相关路线 - 这也可能是我跌倒的地方

router.put('/', function(req, res) {
  console.log(req.body)
  Snippet.findByIdAndUpdate(
    req.body.id,
    {
      name: req.body.name,
      details: req.body.details,
      content: req.body.content,
    },
    { new: true },
    function(err, response) {
      if (err) {
        console.log('we hit an error' + err)
        res.json({
          message: 'Database Update Failure',
        })
      }
      console.log('This is the Response: ' + response)
    }
  )
})

Answer 1

您在 url 中发送 id，因此您需要从 req.params.id 中解析它。 我也回复了。

路由/sn-ps.js

router.put("/:id", function(req, res) {
  console.log(req.body);
  Snippet.findByIdAndUpdate(
    req.params.id,
    {
      name: req.body.name,
      details: req.body.details,
      content: req.body.content
    },
    { new: true },
    function(err, response) {
      if (err) {
        console.log("we hit an error" + err);
        return res.json({
          message: "Database Update Failure"
        });
      }
      return res.send(response);
    }
  );
});

您还需要在 api.js 中更新这一行。只需在 sn-ps 后添加 /

   .put('/snippets' + data.id, {     => 
   .put('/snippets/' + data.id, {