在 MERN 中使用 POST 方法调用服务器时出现错误 400（错误请求）

Question

我在我的 reactjs 应用程序中创建了一个删除用户帐户按钮。 单击此按钮时，将显示一个表单，用户必须在其中输入当前帐户的密码，然后单击删除才能删除该帐户。 但是，当我测试此功能时，当我单击“删除”按钮时，这不会删除用户帐户，并且在命令行中出现错误：

POST http://localhost:5000/api/auth/delete_profile 400（错误请求）

这是我的文件DeleteAccount.js ：

<form onSubmit={handleDeleteUser}>
            ...
              <TextField
                error={error && error.password ? true : false}
                helperText={error && error.password ? error.password : null}
                onChange={handlePasswordChange}
                 ...
              />
             ...
          </form>

我的useDeleteProfile.js文件：

try {
      const { data } = await axios.post(`${url}/api/auth/delete_profile`,initialState)
              ...
        history.push('/')
}

我的Auth.js文件：

const DeleteAccount = require("../controllers/Auth/DeleteProfile")
  ...
router.post('/delete_profile',authRequired, DeleteAccount)

我的DeleteProfile.js文件：

module.exports = async (req, res) => {
  const { password } = req.body
  let error = {}

  if (!password || password.trim().length === 0) {
    error.password = 'password must be required'
  }

  
  if (Object.keys(error).length) {
    return res.status(422).json({ error })
  }

  try {

    const verifyPassword = await bcrypt.compare(password, user.password)
    if (!verifyPassword) {
      return res.status(400).json({ error: 'password is incorrect' })
    } else {

    await User.deleteMany({ user: req.userId })
    res.status(200).json({ message: 'User Deleted Successfully' })

    }
  } catch (err) {
    console.log(err)
    return res.status(500).json({error:"Something went wrong"})
  }

}

为了解决这个错误，我用DELETE方法替换了POST方法，因为它是一个删除操作。 在我的useDeleteProfile.js文件中是这样的：

 const { data } = await axios.delete(`${url}/api/auth/delete_profile`,initialState)

在我的Auth.js文件中就像这样：

router.delete('/delete_profile',authRequired, DeleteAccount)

现在，我收到以下错误：

删除 http://localhost:5000/api/auth/delete_profile 400（错误请求）

. 所以我像这样修改了我的useDeleteProfile.js文件，但没有：

const { data } = await axios.delete(`${url}/api/auth/delete_profile`,
       initialState,
      {
        headers: {
          Authorization: `Bearer ${token}`,
        },
      },
    )

我还像这样修改了我的 Auth.js 文件：

router.delete('/api/auth/delete_profile',authRequired, DeleteAccount)

但现在，我收到以下错误：

删除 http://localhost:5000/api/auth/delete_profile 404（未找到）

我也查看了这个stackoverflow 问题，但没有成功。 有人可以帮助我吗？ 谢谢 ！

Answer 1

您收到错误是因为您使用了不正确的路由路径。

下面是正确的方法

对于POST http://localhost:5000/api/auth/delete_profile使用

router.post('/api/auth/delete_profile',authRequired, DeleteAccount)

对于DELETE http://localhost:5000/api/auth/delete_profile使用

router.delete('/api/auth/delete_profile',authRequired, DeleteAccount)

Answer 2

为什么你添加 /api/auth/ 前缀只放你的相对路径

router.delete('/api/auth/delete_profile',authRequired, DeleteAccount)

替换为

router.delete('/delete_profile',authRequired, DeleteAccount)