2020年3月31日 星期二

axios 加上before after處理

使用axios如果需要在
request送出前 加工送出去的資料
或接收到response後 加工收到的結果
可以使用這樣的結構去攔截修改
1.建立request物件
2.送出request前加工送出資料
  可以加入header或調整送出內容
3.接收到api回應後 做資料整理

const myRequest = axios.create({
  ...
})
myRequest.interceptors.request.use(config => {
  // 修改config內容 就是
  config.headers[xxx] = xxxx //加上header
  return config
})
myRequest.interceptors.response.use(
  response => {
    .... // 自行處理
    return response 
})
例如axios送出資料
需要以x-www-form-urlencoded 格式送出
除了需要加上content-type設定外
還需要在送出去之前 對於資料先做轉換(需另外用qs處理)
import Qs from 'qs'
myRequest.request.use(config => {
  config.data = Qs.stringify(config.data)
  return config
})

沒有留言: