[Koa2 系列 03] Post 請求接收（上）

由於 Koa2 沒有封裝方便接受 Post 參數的方法
需要藉由解析上下文 context 中原生 node.js 請求來取得
這篇主要以理論方面為主，下一篇則是以實作為主

獲取Post請求的步驟：

1. 解析上下文 ctx 中的原生 node.js 物件 req
2. 將 POST 表單數據解析成 query string（例如 : user=lemon&age=18）
3. 將 query string 轉換成 JSON 格式

ctx.request和ctx.req的區別

ctx.request

是 Koa2 中 context 經過封裝的請求物件，它用起來更直觀和簡單

ctx.req

是 context 提供的 node.js 原生 HTTP 請求物件
這個雖然不那麼直觀，但是可以得到更多的內容

ctx.method 得到請求方法

Koa2中提供了 ctx.method 屬性，可以輕鬆的得到請求的方法
然後根據方法編寫不同的相應方法，這在工作中非常常用

我們先來作個小例子，根據請求類型獲得不同的頁面內容
GET 請求時得到表單填寫頁面，POST 請求時，得到 POST 處理頁面

const Koa = require('koa');
const app = new Koa();
app.use(async(ctx)=>{
	//當請求時GET請求時，顯示表單讓用戶填寫
	if (ctx.url==='/' && ctx.method === 'GET'){
	let html =`
		<h1>Koa2 request post demo</h1>
            <form method="POST"  action="/">
                <p>userName</p>
                <input name="userName" /> <br/>
                <p>age</p>
                <input name="age" /> <br/>
                <p>webSite</p>
                <input name='webSite' /><br/>
                <button type="submit">submit</button>
            </form>
        `;
	ctx.body =html;
    
    //當請求時POST請求時
    } else if (ctx.url==='/' && ctx.method === 'POST'){
        ctx.body='接收到請求';
    } else {
        //其它請求顯示404頁面
        ctx.body='<h1>404!</h1>';
    }
})

app.listen(3000,()=>{
    console.log('[demo] server is starting at port 3000');
})

Get 請求時候的畫面

表單送出，變為觸發 Post 請求頁面時