无法从 React axios post 在 Web API HttpPost 方法中接收数据答案

【问题标题】：Unable to receive data in a Web API HttpPost method from React axios post无法从 React axios post 在 Web API HttpPost 方法中接收数据
【发布时间】：2021-01-11 13:30:15
【问题描述】：

我的 Web API Post 方法在 Swagger 上运行良好，但是当我使用 axios 从我的 React 应用程序发送发布请求时，数据 [FromBody] 为空。这是 Web API 方法。

[HttpPost]
[Route("api/employee/addMany")]
public IHttpActionResult Post([FromBody] dynamic data)  //my axios request hit this method but data is always null. I have tried passing without stringifying
  {
   Employee[] employees=JObject.Parse(data);
   //doing some stuff with employees
   return Ok();
  }

这里是 Axios 发布请求代码


export function addEmployees(employees:Employee[]) {
  return axios.post(`api/employee/addMany`, { employees });
}

这里是请求拦截器，执行模型键 Pascalization 和字符串化数据。

const pascalizeKeys = (obj:any):any => {
  if (Array.isArray(obj)) {
    return obj.map(v => pascalizeKeys(v));
  } else if (obj !== null && obj.constructor === Object) {
    return Object.keys(obj).reduce(
      (result, key) => ({
        ...result,
        [String(upperFirst(key))]: pascalizeKeys(obj[key]),
      }),
      {},
    );
  }
  return obj;
};

export function applyInterceptors(Axios:typeof axios){
  Axios.interceptors.request.use((request)=>{
    if(request.data){
      request.data = JSON.stringify(pascalizeKeys(request.data));
      return request;
    }
    return request;
  }
  )
}

【问题讨论】：

我最近在 axios 和 post 上遇到了很多问题，这是一个臭名昭著的问题，请参阅此处 github.com/axios/axios/issues/1195（还包含一些关于您可以尝试的建议）。您可以先尝试将标头设置为 'content-type': 'application/json' 然后尝试附加到数据或参数字段吗？

标签： javascript reactjs asp.net-web-api asp.net-web-api2

【解决方案1】：

尝试让 axios post 工作的事情：

设置标题

headers: {
          'content-type': 'application/json',
     }

尝试将您的 json 附加到请求的 data 或 params 字段
如果您仍然无法获取数据，请将其作为新的formData 发送到数据字段中

let formData = new FormData()

formdata.append('name', yourJson)

await axios({
  method: 'post',
  url: '/your/url',
  data: formData,
  headers: {
    'Content-Type': 'multipart/form-data',
  },
})

你现在应该得到它与你的要求

【讨论】：

享受哥们 :) 你是 300+