前端接口时添加transformRequest，transformResponse配置时，后端直接返回400错误

Question

报错截图

报错信息码

SyntaxError: Unexpected token a in JSON at position 0
    at JSON.parse (<anonymous>)
    at createStrictSyntaxError (E:Alldemo	s-axios
ode_modulesody-parserlib	ypesjson.js:158:10)
    at parse (E:Alldemo	s-axios
ode_modulesody-parserlib	ypesjson.js:83:15)
    at E:Alldemo	s-axios
ode_modulesody-parserlib
ead.js:121:18
    at invokeCallback (E:Alldemo	s-axios
ode_modules
aw-bodyindex.js:224:16)
    at done (E:Alldemo	s-axios
ode_modules
aw-bodyindex.js:213:7)
    at IncomingMessage.onEnd (E:Alldemo	s-axios
ode_modules
aw-bodyindex.js:273:7)
    at IncomingMessage.emit (events.js:201:15)
    at endReadableNT (_stream_readable.js:1130:12)
    at processTicksAndRejections (internal/process/task_queues.js:84:17)

前台浏览器报错信息截图

server.js
直接复制老师的

function registerConfigRouter () {
  
  router.post('/config/post', function(req, res) {
    console.log(req.body)
    res.json(req.body)
  })
}

config/app.ts

import axios, { AxiosTransformer } from '../../src/index'
import qs from 'qs'
axios({
  transformRequest: [(function(data) {
    return qs.stringify(data)
  }), ...(axios.defaults.transformRequest as AxiosTransformer[])],
  transformResponse: [...(axios.defaults.transformResponse as AxiosTransformer[]), function(data) {
    if (typeof data === 'object') {
      data.b = 2
    }
    return data
  }],
  url: '/config/post',
  method: 'post',
  data: {
    a: 1
  }
}).then((res) => {
  console.log(res.data)
})

同时下面单独这样是不报错的

import axios, { AxiosTransformer } from '../../src/index'
import qs from 'qs'

axios.defaults.headers.common['test2'] = 123 
axios({
  url: '/config/post',
  method: 'post',
  data: qs.stringify({
    a: 1
  }),
    // data:{a:1},
  headers: {
    test: '321'
  }
}).then((res) => {
    
  console.log(res)
})

Answer 1

ustbhuangyi 2019-05-23 13:08:38

贴一下报错的时候，你的请求 body 数据的格式是怎么样的。

• 提问者 若强 #1

  老师我更新了一下截图，里面现在有了请求 body 数据的格式
  请求题的数据： 
  Request Payload
    a=1

• 提问者 若强 #2

  然后我把传递的data格式在transformRequest里面改成这样 return qs.stringify(data) ---->return data才可以正确的返回想要的结果：{a: 1, b: 2};-------------------------------------------------------------
  
  
  axios({
    transformRequest: [(function(data) {
      return data
    })
  老师这样直接去掉qs.stringify解决有什么问题吗

• ustbhuangyi 回复 提问者 若强 #3

  从请求上看，content-type 是 application/json;charset=utf-8，但是 request body 是 a=1，服务端收到肯定会报错，因为 a=1 不是一个合法的 json 格式。
  你先检查一下代码逻辑有没有问题，如果检查不出来，把项目发到 GitHub 上我帮你看看

点开查看后面3条评论