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

来源:9-6 请求和响应配置化- transform 逻辑重构 + demo 编写

若强

2019-05-23

报错截图
图片描述
报错信息码

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)
})
写回答

1回答

ustbhuangyi

2019-05-23

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

0
6
慕仔0553886
回复
若强
你是怎么解决的,可以贴一下代码吗
2020-05-18
共6条回复

下一代前端开发语言 TypeScript从零重构axios

课程从零开始重构功能完整的JS库,是学习造轮子的不二之选!

2629 学习 · 877 问题

查看课程