生活随笔
收集整理的這篇文章主要介紹了
koa --- restful规范及其栗子
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
遵循Restful規范的簡單的栗子
<html><head><script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script><script src="https://unpkg.com/element-ui/lib/index.js"></script><script src="https://unpkg.com/axios/dist/axios.min.js"></script><link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css" /></head><body><div id="app"><div style="display: flex;flex-direction: column;"><el-input v-model="form.name" autocomplete="off" placeholder="姓名" style=""></el-input><el-button v-on:click="get">GET
</el-button><el-button v-on:click="post">POST
</el-button><el-button v-on:click="del">DELETE
</el-button><el-button v-on:click="put">PUT
</el-button><el-button v-on:click="logs=[]">Clear Log
</el-button></div><ul><li v-for="(log, idx) in logs" :key="idx">{{log}}
</li></ul></div><script>axios.defaults.baseURL = "http://localhost:3000";axios.interceptors.response.use(response => {app.logs.push(JSON.stringify(response.data));return response;},err => {app.logs.push(JSON.stringify(response.data));return Promise.reject(err);})var app = new Vue({el: '#app',data: {form: {name: 'marron',id: 3},logs: []},methods: {async post() {const res = await axios.post("/users", this.form);},async get() {const res = await axios.get("/users");},async put() {const res = await axios.put("/users", this.form);},async del() {const res = await axios.delete("/users/3");}}})</script>
</body></html>
const Koa
= require("koa");
const app
= new Koa();
const Router
= require("koa-router");
const router
= new Router({ prefix
: "/users" });
const cors
= require("koa2-cors");
const bodyParser
= require("koa-bodyparser");
app
.use(cors());
app
.use(bodyParser());const users
= [{id
:1 , name
:"tom"}, {id
:2, name
: "jerry"}];
router
.get("/", ctx
=>{console
.log("GET /users");const {name
} = ctx
.query
; let data
= users
;if (name
) {data
= users
.filter (u
=> u
.name
=== name
);}ctx
.body
= {ok
: 1, data
};
});
router
.get("/:id", ctx
=>{console
.log("GET /users/:id");const {id
} = ctx
.params
; const data
= users
.find(u
=> u
.id
== id
);ctx
.body
= {ok
:1 , data
};
});
router
.post("/", ctx
=>{console
.log("POST /users");const {body
: user
} = ctx
.request
; user
.id
= users
.length
+1;users
.push(user
);ctx
.body
= { ok
: 1};
});router
.put("/", ctx
=> {console
.log("PUT /users");const {body
: user
} = ctx
.request
; const idx
= users
.findIndex(u
=> u
.id
== user
.id
);if(idx
> -1){users
[idx
] = user
;}ctx
.body
= { ok
: 1};
});
router
.delete("/:id", ctx
=>{console
.log("DELETE /users/:id");const {id
} = ctx
.params
;const idx
= users
.findIndex(u
=> u
.id
=== id
);if( idx
> -1){users
.splice(idx
, 1);}ctx
.body
={ ok
: 1};
});app
.use(router
.routes());
app
.listen(3000, ()=>{console
.log("[Server] Server is running at http://localhost:3000");
})
Restful規范幾個注意:
動賓結構
客戶端發出的指令都是"動詞 + 賓語"的結構,如: “GET / articles”動詞的覆蓋
可以使用 X-HTTP-Method-Override屬性告訴服務器使用哪一個動詞覆蓋POST方法
POST /api
/marron
/1 HTTP/1.1
X-HTTP-Method
-Override
: PUT
上面指明了PUT方法.
在服務器端（koa2）使用下面方法接受
router
.put("/api/marron:id", async ctx
=>{
})
賓語必須是名詞,且盡量為復數
不要出現/getnames 或 /name之類的,盡量使用 /names盡量扁平化
不要出現GET /authors/12/categories/2 ,如果可以,盡量使用GET /authors/12?categories=2
總結
以上是生活随笔為你收集整理的koa --- restful规范及其栗子的全部內容，希望文章能夠幫你解決所遇到的問題。
如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。
