Node.js/Express+Axios未找到数据时自定义状态及错误消息问题

一、为什么前端收不到404的自定义消息？ #

Axios默认会将状态码≥400的响应归类为错误，直接抛出到catch块，而非进入try块的response。但你后端返回的自定义消息其实存在错误对象中，只是当前代码没有正确提取。

修改前端代码，从error.response.data中获取后端返回的自定义消息：

const trycatch = async () => {
    try {
        const response = await axios.get('example.com/trycatch')
        return response.data;
    } catch (error) {
        // 提取后端返回的自定义消息
        console.log(error.response.data); // 这里会输出'no user'
    }
}

二、未找到数据时返回200状态码的实现 #

如果希望未找到数据时仍返回200状态码，只需避免使用404状态码，而是返回一个包含状态标识的结构化响应，让前端通过响应内容判断结果：

修改后的后端代码 #

router.get('/getuser', async (req, res) => {
    try {
        const user = await User.findOne({_id: req.user._id});
        if (!user) {
            // 返回200状态码，同时携带无数据的标识和消息
            res.status(200).send({ 
                success: false, 
                message: 'no user',
                data: null 
            });
        } else {
            res.status(200).send({ 
                success: true, 
                data: user 
            });
        }
    } catch(error) {
        res.status(500).send({ 
            success: false, 
            message: '服务器错误',
            error: error.message 
        });
    }
});

前端对应处理 #

const trycatch = async () => {
    try {
        const response = await axios.get('example.com/trycatch')
        const { success, data, message } = response.data;
        if (!success) {
            console.log(message); // 输出'no user'
            return null;
        }
        return data;
    } catch (error) {
        console.log(error.response.data.message); // 处理服务器错误
    }
}

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