axios GET请求参数传递失效，MongoDB查询结果异常问题

问题现象 #

前端Vue项目通过axios发起GET请求，尝试传递customername: 'ALEX'参数；后端Express从request.body获取该参数查询MongoDB的po_order集合时，返回的是不含customername字段的文档。但将查询条件改为固定值'ALEX'时，能得到预期结果，说明参数未被正确传递或接收。

错误原因 #

1. 前端参数传递错误：axios的GET请求参数不能直接放在配置对象的根层级，必须放在params属性中，否则参数不会被拼接为URL查询字符串发送。
2. 后端参数接收错误：GET请求没有请求体，参数会通过URL查询字符串传递，因此应该从request.query中获取，而非request.body。

修正后的代码 #

前端Vue代码

const po_orders = ref([]);
onMounted(async () => {
  const res = await axios.get("http://127.0.0.1:4914/server/po_order", {
    params: { // 参数放在params属性中
      customername: 'ALEX'
    }
  });
  po_orders.value = res.data;
  console.log(res);
});

后端Express代码

app.get('/server/po_order', (request, response) => {
  // 从request.query中获取GET参数
  database.collection("po_order").find({ customername: request.query.customername }).toArray((error, result) => {
    if (error) {
      console.log(error);
    }
    response.send(result);
  });
});

补充说明 #

• GET请求的参数始终通过URL的查询字符串传递，后端框架中对应request.query对象；
• POST/PUT等请求的参数才会放在请求体中，通过request.body获取（需提前配置express.json()或body-parser中间件）。

内容的提问来源于stack exchange，提问作者Nopmd