vue-新しいメッセージングfetch&axios

8177 ワード

vue-新しいメッセージングfetch&axios
fetch
​ why:
XMLHttpRequestは設計が粗いAPIであり,構成と呼び出し方式が非常に混乱しており,イベントベースの非同期モデルは友好的ではない.
fetchの問題は互換性が悪いことです
ie 8と互換性のあるpolyfill:https://github.com/camsong/fetch-ie8(互換性がないのはXMLHttpRequestで書くのが原理です)
//get
fetch("./json/test.json").then(res=>res.json()).then(res=>{
     console.log(res)}
/*    .then        res.text          res.json   json   */
                                                     
//post
fetch("**",{
     
method:'post',
 headers: {
     
"Content‐Type": "application/x‐www‐form‐urlencoded"
},
body: "name=kerwin&age=100"
}).then(res=>res.json()).then(res=>{
     console.log(res)});
fetch("/users",{
     

method:'post',
// credentials: 'include',
headers: {
     
"Content‐Type": "application/json"
},
body: JSON.stringify({
     
name:"kerwin",
age:100
})
}).then(res=>res.json()).then(res=>{
     console.log(res)});

注意:Fetchリクエストのデフォルトはクッキーなしで、fetch(url,{credentials:‘include’})を設定する必要があります.
axios
axios.get("")
axios.post("")
axios.put("")
axios.delete("")

axios({
     
url:"",
headers:{
     
'X‐Client‐Info': '{"a":"3000","ch":"1002","v":"1.0.0","e":"1"}',
'X‐Host': 'mall.cfg.common‐banner'
}
}).then(res=>{
     
console.log(res.data);
})

         

{
     
*:*
 data:      
 }