1. 程式人生 > 其它 >axios傳送formdata請求

axios傳送formdata請求

axios傳送formdata請求

axios 預設是 Payload格式資料請求,但有時候後端接收引數要求必須是 Form Data 格式的,所以我們就得進行轉換。
Payload和Form Data的主要設定是根據請求頭的 Content-Type 的值來的:
Payload   Content-Type: 'application/json; charset=utf-8'
Form Data   Content-Type: 'application/x-www-form-urlencoded'
實現方法:

axios({
   method: 'post',
   url: 'http://localhost:8080/login',
   data: {
      username: obj.username,
      password: obj.passwd
   },
   transformRequest: [
      
function (data) { let ret = '' for (let it in data) { ret += encodeURIComponent(it) + '=' + encodeURIComponent(data[it]) + '&' } ret = ret.substring(0, ret.lastIndexOf('&')); return ret } ], headers: { 'Content-Type': 'application/x-www-form-urlencoded' } })

我們也可以利用攔截器進行全域性配置:

import axios from 'axios'
import qs from 'qs'
 
// 例項物件
let instance = axios.create({
  timeout: 3000,
  headers: {
    'Content-Type': 'application/x-www-form-urlencoded'
  }
})
 
// 請求攔截器
instance.interceptors.request.use(
  config => {
    config.data = qs.stringify(config.data) //
轉為formdata資料格式 return config }, error => Promise.error(error) )

其中 qs 模組是安裝 axios 模組的時候就有的,不用另行安裝,通過 import 引入即可使用。