axios傳送formdata請求
阿新 • • 發佈:2021-10-09
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 引入即可使用。