基本使用
headers物件
request物件
fetch 與 xmlhttprequest 的差異
axios
***結合jwt驗證使用者資訊
請求***：給請求新增上token
響應***：統一處理錯誤請求
提供了乙個獲取資源的介面,更強大和靈活的功能集
建立乙個response物件的轉殖
讀取 response物件並且將它設定為已讀（因為responses物件被設定為了 stream 的方式，所以它們只能被讀取一次） ,並返回乙個被解析為json格式的promise物件
讀取 response物件並且將它設定為已讀（因為responses物件被設定為了 stream 的方式，所以它們只能被讀取一次） ,並返回乙個被解析為usvstring格式的promise物件
可以通過 headers() 建構函式來建立乙個自己的 headers 物件。
第一種方式
var myheaders =
newheaders()
;myheaders.
("content-type"
,"text/plain");
myheaders.
("content-length"
, content.length.
tostring()
);myheaders.
("x-custom-header"
,"processthisimmediately"
)
myheaders =
newheaders()
;
function
onpost()
const headers =
newheaders()
; headers.
("content-type",)
;const request =
newrequest
("/postdata",)
fetch
(request)
.then
((res)
=>).
then
((data)
=>
)}
function
onget()
axios(}
).then
((res)
=>
)}
function
onpost()
axios(}
).then
((res)
=>
)}
function
onget()
axios.
get(
"/getdata",,
}).then
((res =>))
}function
onpost()
axios.
post
("/postdata",,
}).then
((res =>))
}
比如新增頭欄位、對使用者密碼進行驗證等
axios.interceptors.request.
use(
(config)
=>);
axios.interceptors.request.
use(
(config)
=>
);
axios.interceptors.response.
use(
(response)
=>);
axios.interceptors.response.
use(
(response)
=>
);
use(
koajwt()
.unless()
);
router.
post
("/login"
,(ctx)
=>
= ctx.request.body;
if(username ===
"h"&& passwd ===
"123"),
secret,);
ctx.body =,}
;}else;}});
loginbtn.
addeventlistener
("click"
,async()
=>);
console.
log(res.data)
;const token = res.data.data.token;
localstorage.
setitem
("token"
,"bearer "
+ token);}
);
// 生產壞境的字首
// 生產壞境 localhost:8081
// 開發壞境 localhost:8080
;
use(
koajwt()
.unless()
);
// 結合 jwt
// 請求***
故意設定個延遲2s，然後後端定時3s響應，然後報錯
// 生產壞境的字首
// 生產壞境 localhost:8081
// 開發壞境 localhost:8080
;// 統一處理錯誤
myaxios.interceptors.response.
use(
(res)
=>
,(err)
=>
return promise.
reject
(err);}
);export
default myaxios;
比如token值清空後的錯誤處理
myaxios.interceptors.response.
use(
(res)
=>
,(err)
=>
return promise.
reject
(err);}
);
前後端互動
剛進公司，對這些都不是很了解，這篇部落格講的很清楚，在此轉給自己，感謝szmacbook 1.前端請求資料url由誰來寫?在開發中,url主要是由後台來寫的,寫好了給前端開發者.如果後台在查詢資料,需要借助查詢條件才能查詢到前端需要的資料時,這時後台會要求前端提供相關的查詢引數，這裡的查詢引數也就是...
前後端互動
xmlhttprequest物件 ajax的基本使用 xhr.onload function 使用post傳參，是需要設定頭部資訊 把資料放到form中的三個好處 引數1 屬性名 自定義 引數2 屬性值 form.img file 將需要上傳的檔案資訊，新增到form中 form.name 張三 g...
前後端互動原理
埠 一台高效能的電腦只不過沒有主機，用於處理資料或者一些反饋 資料庫 資料的倉庫 表面意思 前端 的樣式 後端 通過一些處理將資料傳遞到前端，後台技術 sql 相當於乙個翻譯軟體，將埠的指令轉換為資料庫可用的 對於前幾者的關係，我有一些個人理解 我將乙個上網過程看做去商店購買商品 我 本機 想去商店...