前端axios发送post请求，后端ctx.request看不到数据

小白第一次尝试 React + axios + Koa2 + mongodb
（假如前端用Vue，后端用express，也是一样的）

原本

按照格式给后端发数据：

//前端 index.js
//         ....
var data={
      key:value //省略一千字
}
axios.post(url,data)
//         ....


//后端 server.js
//         ....
router.post(url,async(ctx,next)=>{
  //         ....
 console.log(ctx.request)
 //         ....
})
//         ....

结果是:

image.png

即使把整个ctx打印了也不知道上哪找我传给后端的data。
网上说是request的content-type不应该是application/json，应该是application/x-www-form-urlencoded。但是按照网上说的用qs.stringfy（data）变成那种content-type也没用。

解决

在chrome的控制台，发现数据其实在request payload 里

image.png

那么后端要怎么拿到request payload里的数据呢？
===========>用formidable
只需增改后端代码: (事先npm install koa2-formidable)

//         ....
const formidable = require('koa2-formidable')
app.use(formidable())
//         ....
router.post(url,async(ctx,next)=>{
  //         ....
  let { body, files } = ctx.request  //要的数据就在body里
  console.log(body)
  //         ....
}
//         ....

最后成功打印出前端传来的数据

image.png

这个问题让我这小白绕了好久，先记下。