一、application/json

axios預設的content-type是‘application/json；charset=UTF-8’

預設情況下，axios將JavaScript物件序列化為JSON

axios中文文件

get請求，引數會以URL String的形式進行傳遞。即?後的字串為請求引數，多個以&作為分隔符。見控制檯network的Query String Parameters

post請求，引數在請求體裡，見控制檯network的Request Payload(http request payload body) 

當然也可以【Query String Parameters】與【Request Payload】同時傳遞且互不影響

axios({
      method: 'post',
      url: '/api/ap?id=5',
      data: {"id":"最新AP2","mac":"2c 16 bd 42 00 2d","apId":18},
      // params: {id: 5} // 以問號形式拼接在URL後面，或者通過params屬性傳遞
    })

可以發現url上的引數id和payload裡的引數id互不影響，都可以傳遞。 

瀏覽器原生的form表單提交，是以‘application/x-www-form-urlencoded’方式傳遞資料

請求引數是以字串的格式（類似get請求的QueryString格式）放在Form Data中，

如果引數是物件，需要使用qs轉換，或者使用new FormData

QS中文文件

【區分】： JSON.stringfy()  和 qs.stringfy() 
  let  data = { name: 'edward', age: '25' }
  前者：JSON.stringfy(data)  //  ”{ 'name' : 'edward' , 'age' : '25' }”
  後者：qs.stringfy(data)  // 'name=edward&age=25'

XMLHttpRequest Level 2添加了一個新的介面FormData。

利用FormData物件，我們可以通過js用一些鍵值對來模擬一系列表單控制元件，

使用XMLHttpRequest的send方法來非同步的提交這個"表單"，或者使用第三方庫，比如fetch、axios

var formData = new FormData();
formData.append("username", "Groucho");
formData.append("accountnum", 123456); 
axios({
  method: 'POST',
  url:'/users'
  data: formData 
})

使用Input上傳檔案，或者直接將檔案流通過xhr提交後臺介面

一般不用額外設定請求頭的Content-Type，瀏覽器會自動識別流檔案

引數請求格式：Content-Type: multipart/form-data;boundary=${boundary}


${boundary}是瀏覽器隨機生成的字串，用來分割引數，作用等同於 &

注意點：

• 傳統的HTTP請求時候，Content-Type預設為"文字"型別（text/plain）
• 傳統的form提交的時候，Content-Type預設為"Form"型別（application/x-www-form-urlencoded)
• axios傳遞字串的時候，Content-Type預設為"Form"型別（application/x-www-form-urlencoded)
• axios傳遞FormData格式資料時，Content-Type預設為"Form"型別（multipart/form-data; boundary=${boundary})
• axios傳遞物件的時候，Content-Type預設為"JSON"型別（application/json)

擴充套件，使用xhr傳遞流檔案到後臺服務

  var dataUrl = '流地址'
  var fileName = new Date().getTime() + '_' + Math.random() + '.jpg';// 以時間戳作為檔名
  var file = new File([dataUrl], fileName, { type: 'image/jpg' }); 
  var formData = new FormData();
  formData.append('file', file);

    var xhr = new XMLHttpRequest();
    xhr.onreadystatechange = function () {
        if (xhr.readyState === 4) { // 介面響應完成
            if (xhr.status === 200) {
                  // 成功
                }
            } else {
                // 失敗
            }
        }
    }

    xhr.open('POST', '/api/pictures/upload', true);
   // 注意請求頭的Content-Type不用設定
   xhr.send(formData);