前言:作為前端必不可少的是與后台交互,當前端頁面寫好,后台接口還沒開發好的時候,前端自己寫json數據,模擬
后台交互,不失為一種好方法,更為重要的一點是,使用json假數據模擬接口調用,前端和后台算是某種程度的一種分離,不在是后台寫好接口,
前端調用中出現問題,再交給后台去修改,后台修改好交給前台用,這樣無疑造成了,前后台反復打磨的時間浪費。
前台使用json數據模擬后台接口,不是模擬后台接口的功能實現,而是模擬兩種狀態,所有真正的接口調用最后無疑兩種狀態,成功或者失敗
在模擬的過程中,前端要考慮的是成功情況下前端要做什么事情,失敗情況下前端又要做什么事情,如果某些接口需要給后台傳遞參數,那么此時前端可以自己在
需要傳參的data里寫上符合條件的參數,(參數可以寫成固定的)
tips:如果在引用json文件的時候報404錯誤,不妨嘗試把url路徑寫成絕對路徑。
例子:目錄結構:
json格式要正確,外面記得{}包裹
cs.json:
{ "list":[ { "id":1, "name":"張三" },{ "id":2, "name":"李四" } ] }
html:
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> </head> <body> <p></p> </body> <script src="js/jquery-3.1.1.min.js"></script> <script type="text/javascript"> $(function(){ $.ajax({ url: "js/cs.json", data: {
//id:"101" 如果需要傳參,可以寫成固定值的來模擬
}, method: "get",//模擬json,使用get請求,正式請求換成實際接口的post、get等 header: { 'content-type': 'application/json' // 默認值 }, success(res) { console.log(res) } }) }) </script> </html>
打印結果:上圖console.log(res)的打印
然后在success方法里,寫自己成功后的操作