iT邦幫忙

2026 iThome 鐵人賽

DAY 23
0

今天繼續上一篇的內容

5.看懂 Buffer

平常前端處理:

"hello"
123
true
{}
[]

但檔案本質不是「字串」。

例如:

圖片
PDF
ZIP
影片

底層其實都是 binary(二進位資料)。

Node.js 用 Buffer 表示這種資料。

例如:

const buffer = Buffer.from('Hello');

console.log(buffer);

你可能看到:<Buffer 48 65 6c 6c 6f>

所以之後做檔案上傳時,可以先把它理解成:
Buffer = Node.js 處理原始二進位資料的一種容器。

6.用原生 http 建最小 API
不用 Express,直接用 Node.js:

const http = require('http');

const server = http.createServer((req, res) => {
  res.end('Hello Node');
});

server.listen(3000);

流程其實就是:

Client
   ↓ request
Node Server
   ↓
req
   ↓
處理
   ↓
res
   ↓ response
Client

7.用 formidable 接檔案上傳

瀏覽器可能送:multipart/form-data

裡面有:

欄位
+
檔案 binary data

如果全部自己解析會很麻煩,所以使用:npm install formidable

然後 const formidable = require('formidable');

由 formidable 來解析:

HTTP Request
     ↓
multipart/form-data
     ↓
formidable
     ↓
fields + files

8.總結

總結上述 7 個流程,其實最後是在完成同一件事情:
做一個可以設定環境參數、接收 HTTP Request、解析 multipart 資料並儲存檔案的 Node.js API。

package.json
     ↓
npm install
     ↓
node_modules
     ↓
require('formidable')

.env
     ↓
dotenv
     ↓
process.env

HTTP Request
     ↓
Buffer / binary
     ↓
formidable
     ↓
檔案
     ↓
存到 UPLOAD_DIR

上一篇
Day 22 - NPM 與套件管理 -1
下一篇
Day 24 - Express.js 基礎 -1
系列文
在AI 時代的碰撞下~當前端工程師開始碰上後端又到了雲服務的旅程 共 24 篇
圖片
  熱門推薦
圖片
{{ item.channelVendor }} | {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言