課程目標
- 使用 node 與 express 回應 http post request
課程內容
前面幾課我們學習了 http get 的寫法，這次來學 http post 的寫法
在「會更新主機資料狀態」的操作時，通常都會用 http post
例如，新增資料、更新資料、刪除資料，等等常見操作！
通常主機資料狀態會放在「資料庫軟體」例如 mysql 裡面，我們簡單起見，放在一個 json 檔案就好！
替這課建立 lesson6 資料夾，內容跟 lesson5 一樣即可
新增一個 new.ejs 檔案，放入以下內容
<h1>新同學報到！</h1>
<form method="post" action="/create">
name: <input type="text" name="name">
</form>
然後在 index.js 加入這段程式碼
const bodyParser = require('body-parser');
app.use(bodyParser.urlencoded({ extended: true }));
app.get('/new', function(req, res){
res.render('new');
});
app.post('/create', (req, res) => {
const fs = require('fs');
const name = req.body.name;
const data = fs.readFileSync('./lesson6/users.json');
const users = JSON.parse(data);
users.push({ name: name });
fs.writeFileSync('./lesson6/users.json', JSON.stringify(users));
res.send('<h1>新增成功！</h1>');
})
然後去終端機輸入
node lesson6/index.js
接著打開瀏覽器，在網址輸入
http://localhost:3000/new
你會看到新增同學的頁面與表單！
輸入姓名之後，送出表單就可以新增同學的資料了！
開頭跟 bodyParser 有關的兩行，要引入並設定好，才能使用 req.body 的參數
為什麼要加這兩行？這跟 express 的 middleware 機制設計有關，這邊不深入說明
反正就是在需要使用某些功能的時候，express 不會預設通通提供給你，要請你去設定啟用之後，才會支援
之前處理 http get 的 url 參數時，我們使用 req.query 來取得參數
這次處理 http post 的表單參數時，我們使用 req.body 來取得參數
express 會這樣設計，是因為在 http 協定中，這兩種參數本來就放在不同地方喔！
看不太懂沒關係，先照做就對了！
檔案處理、新增資料放進 json 檔案的段落，跟之前的課程一樣，忘記的話就回頭翻閱一下吧！
課後作業
這次要開發「新增文章」的功能
並且練習用 node 回應 http post request
請把 hw5 的內容複製到 hw6，然後增加 new.ejs 檔案
/repo
/hw6
/index.js
/homepage.ejs
/view.ejs
/new.ejs
/posts.json
/public
/style.css
接著修改主程式 index.js 的內容，讓網站能夠回應 /new 這個網址
這網址會把 new.ejs 的內容 render 出來，內容就放一個 form 表單
表單內可輸入 標題 以及 文章內容，點擊送出按鈕會以 http post 的形式發送到 /create
接著修改主程式 index.js 的內容，讓網站能夠回應 /create 這個網址
將接收到的資料，存進 posts.json 裡面
完成以上任務，你就完成這次的課程目標了！
在上傳到 github 時，你會注意到因為 posts.json 有改變，所以會帶著新資料一起上傳，好像有點怪？
其實，實務上會把資料存在 mysql 這類專門資料庫軟體，不會這樣存在 json 檔案中
本課程為了簡化，所以直接存在 json 檔案，這不是實務正常做法～
為了方便起見，每次新增文章 posts.json 都會改變，就都一起上傳，沒關係～
歡迎將作業成果，在下方留言，跟大家分享，讓大家給你一些回饋！
可以將每課學到的觀念、關鍵字，丟到網路上去搜尋、研究一下！
發問請在「討論專區」為主，或者分享學習筆記、寫學習心得！
貼文都會出現在個人檔案頁面，成為學習歷程、部落格紀錄！
未來面試時，分享給面試官看，會讓人知道你的積極程度！
1) --- 會變成分隔線（上一行必須是空白）
2) # 會變成一級標題
3) ## 會變成二級標題
4) ### 會變成三級標題
5) **粗體文字**會顯示粗體文字
6) ```當第一行與最後一行會顯示程式碼
7) 請搜尋 Markdown 語法，了解各種格式
作業 嘗試取得req.body時發生錯誤 問了chatGPT說缺少middleware:body-parser 安裝並設定完後才成功