axios使用post提交方式

 

進行post提交時

1.需要進行序列化轉換

// Form Data方式   （默認是這種方式）

// axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=UTF-8';

 

 

2..直接提交json格式不用使用qs進行序列化轉換。（后端也要修改為接收json格式）

// Request Payload方式 (不用QS轉)

axios.defaults.headers.post['Content-Type'] = 'application/json';

 

3.

qs可通過npm install qs命令進行安裝，是一個npm倉庫所管理的包。

而qs.stringify()將對象 序列化成URL的形式，以&進行拼接。

JSON是正常類型的JSON，請對比一下輸出

var a = {name:'hehe',age:10};
 qs.stringify(a)
// 'name=hehe&age=10'
JSON.stringify(a)
// '{"name":"hehe","age":10}'


*************************************************

let url = 'id=1&name=chenchen' qs.parse(url) // {id:1，name:chenchen} 

4.

<script>
            
            // 一般引入qs庫都賦值為qs，不過瀏覽器全局引入的是 window.Qs對象，
            // 所以直接用 qs.stringify() 會報 qs undefined
            var qs = Qs 
            // 配置post的請求頭
            axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded'
            // qs.stringify() 這里可以做一下封裝
            axios.post('url', qs.stringify({
                id: 1,
                name: 'zhangsan'
            })).then(function(res) {
                // 返回 Promise對象數據
            })
        </script>