Ajax-在node.js使用fetch時，常會碰到之問題"req.body返回值為空"詳解

參考文章

💓使用MongoDB結合Express和Fetch來實作RESTful API簡單網站(包括用戶Post, Get, Update, Delete等功能)

💓Ajax-運用express和fetch的結合，在node.js上實作前端和後端api路由(Get和Post)的教學

當你需要讀取檔案或別的網站的內容時，並且使用Ajax的fetch來抓取，

之後再傳入node.js中，使用express的post來接收時，是否常常會有

[req.body返回為空] 的問題呢?

app.post("/yo_fetch", (req, res) => {

    // 输出 JSON 格式

    //res.setHeader('Content-Type', 'application/json; charset=utf-8')

    var fetch_response = {

        fetch_name_recieved: req.body.fetch_title,

        fetch_body_recieved: req.body.fetch_body,

        important: req.body.important

    }

    console.log(fetch_response)

    res.send(fetch_response)

    //res.json(fetch_response) //send或josn都可以

})

req.body總是沒有出現東西? 或者是undefined?

💛💛💛

1.如果出現這個問題，你需要body-parser，

const static_path = path.join(__dirname, "public") //變成絕對路徑 D:\qqq\public，nodejs使用絕對路徑較安全可靠，在 Node 中使用相對路徑進行檔案讀取是很危險的, 建議一律都透過絕對路徑的方式來處理

app.use(express.static(static_path))  //如果要提供影像、CSS 檔案和 JavaScript 檔案等之類的靜態檔案，public 的目錄中，提供影像、CSS 檔案和 JavaScript 檔案：

app.use(bodyParser.urlencoded(extended=true)) //extended預設為true 當你需要post的時候 會需要用到urlencoded

app.use(bodyParser.json()); //這個必須存在

body-parser也可以用erpress來代換，記得把它們貼進去你的app.js (server)中

app.use(express.urlencoded({ extended: true })); // 處理 URL 編碼的資料

app.use(express.json()); //這個必須存在

💛💛💛

2. 再來，當我們使用restful api在傳遞json檔案時，需要去特別設定headers

headers: { "Content-Type": "application/json", }

const update = {

    fetch_title: "wei love",

    fetch_body: 'love love love',

    fetch_userId: 909,

    important: "You need body-parser，require body-parser"

};

const options = {

    method: 'POST',

    headers: {

        "Content-Type": "application/json",

    },

    body: JSON.stringify(update)

};

💋沒加headers時>> response為空>> 呼叫response的值會變成undefined

💋

沒加JSON.stringify時，會出現Error，也可以去console和network觀看error的錯誤提示。

JSON.stringify() 是一個 JavaScript 的內建方法，用於將 JavaScript 物件或值轉換為 JSON 字串。

💛💛💛

如果成功的話，你會在f12瀏覽器中>>Network>> 順利看到response。