http請求方式和傳遞數據類型

HTTP(HyperText Transfer Protocol)是一套計算機通過網絡進行通信的規則。

• GET,通過請求URI得到資源
• POST,用於添加新的內容
• PUT用於修改某個內容
• DELETE,刪除某個內容
• PATCH,部分文檔更改

get請求

一般數據都在URL傳參,params：data

eg: Request URL:http://api.anjianba.cn/api/Training/Query或者Request URL:http://api.anjianba.cn/api/Training/Query/23

{
	name:"Myname",
	{
	types:[1,3],
	forms:[2,5]
	}
}

如果傳遞比較復雜的數據時，Query String Parameters，后台不喜歡處理這種數據

正常的處理之后：Request URL:http://api.anjianba.cn/api/Training/Query?planName=&startTime=&endTime=&types[]=1&types[]=3

需要這種形式的：Request URL:http://api.anjianba.cn/api/Training/Query?planName=&startTime=&endTime=&types=1&types=3

在jQuery中是設置 traditional:true,即可轉換為如上數據類型。
axios的config中設置:

 get(url, data = {}, options = {}) {
    let config = {
        params: data,
        headers: {
          、、、
        },{
        'paramsSerializer': function(params) {
            return qs.stringify(params, { indices: false })
			// return qs.stringify(params, { arrayFormat: "repeat" })
     	}，
		...options
	}
    return new Promise((resolve, reject) => {
        axios.get(url, config)
            .then(response => {
                resolve(response.data);
            })
            .catch((error) => {
                reject(error);
            })
    })
  }

post、put、delet請求

提交這種復雜類型數據：

{
	name:"Myname",
	{
	types:[1,3],
	forms:[2,5]
	}
}

• 一般的數據提交類型為json,
  • 對應的數據聲明類型： 'Content-Type':'application/json'
  • 序列化：JSON.stringify(data) json字符串
• 還有 FormData 類型的

  • 對應的數據聲明類型： 'Content-Type':'application/x-www-form-urlencoded;charset=UTF-8'

  • 序列化：qs.stringify(data) ids[]=27&ids[]=26 ==> ids%5B0%5D=27&ids%5B1%5D=26

    注意：谷歌瀏覽器最多有6個請求並行，簡而言之，你可以取消請求，前端不接受請求，但是請求資源一旦占用，pending狀態結束前不可使用
     window._axiosPromiseArr=[];
        //設置cancel函數
    config.cancelToken = new axios.CancelToken(cancel=>{
        window._axiosPromiseArr.push({cancel});
    });
    //手動cancel
    window._axiosPromiseArr.forEach((el,index)=>{
        el.cancel();
    });
    window._axiosPromiseArr = [];
    

最后感謝夏大師的一起討論研究，為本文成稿做出重要貢獻