如何在Axios、Express中设置数组响应？res.send字段配置方法

一、修正你的Express接口代码 #

你的代码里存在一个关键问题：db.query执行SELECT语句后，result是包含多行数据的数组，不是单个对象。直接用result.CustomerName会取不到值，因为数组本身没有这个属性。

正确的做法是遍历result数组，把每一行数据映射成你需要的结构，再返回数组：

app.post('/customer', (req, res) => {
    db.query(
        'SELECT a.CustomerName, a.Phone, a.Email, b.ProjectId, GROUP_CONCAT( p.ProjectCode ) AS Project, GROUP_CONCAT( t.TypeCusDes ) AS TypeCus FROM a LEFT JOIN b ON b.CrmCustomerId = a.CrmCustomerId LEFT JOIN t ON t.TypeCusId = b.TypeCusId LEFT JOIN p ON p.ProjectId = b.ProjectId WHERE a.CustomerName LIKE ? GROUP BY a.CustomerId',
        [req.body.CustomerName],
        (err, result) => {
            if (err) {
                console.log(err);
                // 建议返回错误响应给前端
                return res.status(500).send({ error: '查询失败' });
            }
            // 遍历结果数组，映射成需要的字段结构
            const responseData = result.map(item => ({
                CustomerName: item.CustomerName,
                Phone: item.Phone,
                Email: item.Email,
                ProjectId: item.ProjectId,
                Project: item.Project,
                TypeCus: item.TypeCus
            }));
            // 直接返回数组即可
            res.send(responseData);
        },
    );
});

如果你的查询确实只会返回单条数据，可以用result[0]获取单个对象，但还是建议保留数组逻辑，兼容多条结果的情况。

二、Express中设置数组响应的核心逻辑 #

• Express的res.send()方法支持直接传入数组，它会自动将数组序列化为JSON格式，并设置Content-Type: application/json响应头。
• 不需要额外配置，只要把处理好的数组传给res.send()就完成了数组响应的设置。

三、res.send中配置字段与对应数据 #

• 核心就是构造包含指定字段的对象（或对象数组），把数据库查询结果的字段值赋值给对应的键名。
• 你可以根据需求重命名字段，或者对字段值做额外处理：

  const responseData = result.map(item => ({
      CustomerName: item.CustomerName,
      PhoneNumber: item.Phone, // 重命名字段
      Email: item.Email,
      ProjectId: item.ProjectId,
      Project: item.Project ? item.Project.split(',') : [], // 把GROUP_CONCAT的字符串拆分成数组
      TypeCus: item.TypeCus
  }));
  

四、Axios中接收数组响应 #

在前端用Axios请求这个接口时，response.data就是返回的数组，直接遍历或使用即可：

axios.post('/customer', { CustomerName: 'xxx' })
  .then(response => {
    const customerList = response.data; // 这就是接口返回的数组
    // 遍历数组处理数据
    customerList.forEach(customer => {
      console.log(customer.CustomerName, customer.Phone);
    });
  })
  .catch(error => {
    console.error('请求失败:', error);
  });

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