Content-Type是指http/https發(fā)送信息至服務器時的內(nèi)容編碼類型啤誊,contentType用于表明發(fā)送數(shù)據(jù)流的類型岳瞭,服務器根據(jù)編碼類型使用特定的解析方式,獲取數(shù)據(jù)流中的數(shù)據(jù)蚊锹。
值得一提的是:get請求的headers中沒有content-type這個字段瞳筏,因為get請求不存在請求實體部分,鍵值對參數(shù)放置在 URL 尾部牡昆,因此請求頭不需要設置 Content-Type 字段姚炕。
有的時候服務器接受不到傳值,可以先確認下服務器接受的編碼類型丢烘。
application/x-www-form-urlencoded 與 application/json
headers 設置 { ‘content-type’: ’application/x-www-form-urlencoded’ }:代表參數(shù)以鍵值對字符串傳遞柱宦。
headers 設置 { ‘content-type’: ’application/json’ }:代表參數(shù)以序列化后的json字符串傳遞(json形式的優(yōu)點是它可以傳遞結(jié)構(gòu)復雜的數(shù)據(jù)形式,比如對象里面嵌套數(shù)組這樣的形式等)播瞳。
multipart/form-data
當 content-type 為 multipart/form-data 時掸刊,既可以上傳二進制數(shù)據(jù)( 例如圖片、mp3赢乓、文件 )忧侧,也可以上傳鍵值對石窑。(因為它會將表單的數(shù)據(jù)處理為一條消息,以標簽為單元苍柏,用分隔符分開)
此時的傳輸數(shù)據(jù)的body必須是FormData的實例尼斧,然后通過append方法添加參數(shù)。
let formData = new FormData();
formData.append("parameter", "value");
額外提一個小點:
默認情況下试吁,axios將JavaScript對象序列化為JSON棺棵,所以要以application / x-www-form-urlencoded格式發(fā)送數(shù)據(jù)時,可以引入qs庫編碼數(shù)據(jù)(CDN)熄捍。
JSON.stringfy() 和 qs.stringfy() 的區(qū)別:
let data = { name: 'abc', age: '22' }
JSON.stringfy(data) // "{ 'name' : 'abc' , 'age' : '22' }"
qs.stringfy(data) // "name=abc&age=22"
再提一個與內(nèi)容無關(guān)的點:
關(guān)于跨域烛恤,現(xiàn)在基本上不會由前端用jsonp去解決,因為jsonp很明顯的弊端是只能get請求,不能進行較為復雜的post和其它請求∮嗟ⅲ現(xiàn)在基本都是服務器實現(xiàn)CORS接口來解決缚柏。(可以看下阮一峰的跨域資源共享 CORS 詳解)