首页 > 解决方案 > React/Express - Axios 获取所需的请求帮助

问题描述

尝试使用 Axios 从前端 (React) 向后端 (Express/MongoDB) 发出 API 获取请求。如果我使用 Postman 发出请求,它可以正常工作(您可以在请求正文中输入用户 ID 并取回包含该用户 ID 的对象数组,这就是我想要的),但是从构建的前端进行在 React 中不起作用,我只返回一个空数组。据我所知,我从前端调用的 API 与我在 Postman 中调用的完全一样!任何人都可以对此有所了解吗?

这是从前端发出获取请求的代码:

   const getActivities = async (currentUser) => {
    const config = {
        crossdomain: true,
        headers: {
            "Content-Type": "application/json"
        },
        body: {
            "user": `${currentUser[0].id}`,
        }
        
      
    }
    try {
        const res = await axios.get('http://localhost:5000/api/activities', config)
    console.log(res)
   dispatch({
        type: GET_ACTIVITIES,
        payload: res.data
   })
    } catch (error) {
        console.log(error)
    }
   
   
}

这是后端处理此特定请求的路线:

router.get('/', async (req, res) => {
try {
    const activities = await Activities.find({ user: req.body.user }).sort({ date: -1 })
    if (!activities) {
        res.json({msg: "Nothing found. Go forth and exercise!" })
    }  
   
    res.json(activities).send()
} catch (err) {
    res.send(err.message)
}

})

提前致谢!

标签: node.jsreactjsexpressaxios

解决方案


您不能使用GET方法发送请求正文,请参阅API AXIOS仅用于请求方法“PUT”、“POST”、“DELETE”和“PATCH”。

例如,如果您想保留 GET 方法,请使用参数

// React

const config = {
   crossdomain: true,
   headers: {
       "Content-Type": "application/json"
   },
   params: {
     user: `${currentUser[0].id}`,
   }
}

try {
 const res = await axios.get('http://localhost:5000/api/activities',config)
 console.log(res.data)
}catch(err){
 ...
}

// Express

router.get('/', async (req, res) => {
  console.log(req.query.user)
}

推荐阅读