使用Axios Create发送POST请求时请求体为空的问题求助

我帮你找到了问题所在——你在使用Axios的方式上有个关键误区：把完整的请求配置（包括method、url、data）都传给了axios.create()，但这个方法是用来创建带有默认配置的Axios实例，而不是直接发起请求的。这种写法导致你的请求参数没有被正确传递，后端自然拿不到请求体。

修正后的请求函数 #

我们先创建一个带有基础配置的Axios实例，再用这个实例发起请求，把具体的请求参数传给request()方法：

import axios from 'axios';

// 先创建一个全局的Axios实例，配置基础参数
const axiosInstance = axios.create({
  baseURL: `http://localhost:3333/`,
  headers: {
    'Content-Type': 'application/json',
  },
});

const request = async ({ 
  method = 'get', 
  action, 
  headers, 
  data = null, 
  callbackFunction, 
  exceptionHandlerFunction 
}) => {
  try {
    // 组装具体的请求配置
    const config = {
      method,
      url: action,
      data,
      headers: {
        ...axiosInstance.defaults.headers,
        ...headers, // 允许传入的自定义header覆盖默认值
      },
    };
    
    // 用实例发起请求
    const { data: response } = await axiosInstance.request(config);
    
    // 处理成功回调
    if (callbackFunction) {
      callbackFunction(response);
    } else {
      alert(response.meta.message);
    }
  } catch (error) {
    // 处理错误回调，同时把错误信息传进去方便排查
    if (exceptionHandlerFunction) {
      exceptionHandlerFunction(error);
    } else {
      console.error('请求出错:', error);
    }
  }
};

export default request;

为什么原来的写法会失败？ #

• axios.create()的作用是生成一个预配置的Axios实例，它只接收实例级的默认配置（比如baseURL、全局headers），而method、url、data这些是每个请求的具体参数，应该在调用request()时传递。
• 原来的代码里，你把请求参数都塞进了create()，导致Axios实例没有拿到正确的请求数据，自然无法把data放到请求体里发送。

额外排查建议 #

如果修改后后端还是拿不到数据，可以检查这两点：

• 后端是否配置了解析JSON请求体的中间件，比如Express框架需要添加app.use(express.json())，否则无法解析Content-Type: application/json的请求体。
• 打开浏览器开发者工具的Network面板，查看POST请求的Payload，确认前端是否真的发送了数据——如果Payload里有内容，那问题大概率在后端。

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