iT邦幫忙

2024 iThome 鐵人賽

DAY 23
0
Modern Web

新手友善園區-如何架設人生第一個網站系列 第 23

Day-23 與數據庫溝通:初探 Express.js

  • 分享至 

  • xImage
  •  

在前一篇文章中,我們學會了如何使用 Node.js 設置一個基本的伺服器。今天,我們將進一步探討如何使用 Express.js 來構建一個簡單的 API,讓伺服器能夠回應用戶的請求,並與資料庫進行溝通。

什麼是 Express.js?

Express.js 是一個為 Node.js 提供的輕量級 Web 應用框架,它使得構建伺服器和 API 變得更加容易。它提供了簡潔直觀的 API 來處理 HTTP 請求和回應,並且能與其他中介軟件(middleware)協作來完成更多功能,例如驗證和數據處理。

如何使用 Express.js 構建簡單的 API

讓我們從一個簡單的範例開始,逐步學習如何使用 Express.js 構建 API 並回應用戶的請求。

  1. 安裝 Express.js
    在上一篇文章中,我們已經初始化了一個 Node.js 專案,現在讓我們來安裝 Express.js。開啟命令行,並運行以下指令來安裝 Express:
npm install express

這會將 Express.js 安裝到你的專案中,並準備好我們後續的 API 構建。

  1. 建立 API
    接下來,我們將創建一個簡單的 Express.js 應用,這個應用將會建立一個 RESTful API 並處理不同的 HTTP 請求。
  • 在你的專案目錄下,創建一個新的文件 app.js,並寫入以下代碼:
const express = require('express');
const app = express();
const port = 3000;

// 設置解析 JSON 格式的中介軟件
app.use(express.json());

// 設置 API 路由
app.get('/', (req, res) => {
    res.send('Welcome to my API!');
});

// 模擬數據庫中的數據
let users = [
    { id: 1, name: 'Alice' },
    { id: 2, name: 'Bob' }
];

// 取得所有用戶數據
app.get('/users', (req, res) => {
    res.json(users);
});

// 取得特定用戶數據
app.get('/users/:id', (req, res) => {
    const user = users.find(u => u.id === parseInt(req.params.id));
    if (user) {
        res.json(user);
    } else {
        res.status(404).send('User not found');
    }
});

// 新增用戶
app.post('/users', (req, res) => {
    const newUser = {
        id: users.length + 1,
        name: req.body.name
    };
    users.push(newUser);
    res.status(201).json(newUser);
});

// 啟動伺服器
app.listen(port, () => {
    console.log(`Server is running on http://localhost:${port}`);
});
  1. 代碼解釋
    這段代碼做了什麼?
  • 引入 Express.js:我們通require('express') 引入 Express.js 並建立了一個 Express 應用。
  • 設置中介軟件:我們使用了 express.json() 來解析從請求中傳入的 JSON 數據,這樣我們可以輕鬆地處理 API 的數據傳輸。
  • 定義 API 路由
    • GET/:當訪問伺服器根目錄時,伺服器將回應 "Welcome to my API!"。
    • GET/users:當請求這個路徑時,伺服器將返回一個包含所有用戶的 JSON 格式數據。
    • GET/users/:id:這個路徑允許我們查詢特定 ID 的用戶,如果找不到對應的用戶,伺服器將返回 404 錯誤。
    • POST/users:這個路徑允許我們新增一個用戶,並將其添加到現有的用戶列表中。
  1. 測試 API
    現在我們可以啟動伺服器並測試 API:
  • 開啟終端並運行:
node app.js
  • 然後打開你的瀏覽器並輸入http://localhost:3000,你應該會看到 "Welcome to my API!" 的訊息。
  • 接著,你可以使用工具如 Postman 或瀏覽器的 Fetch API 來測試其他 API 路徑:
    • 訪問 http://localhost:3000/users 可以取得所有用戶的數據。
    • 訪問 http://localhost:3000/users/1 可以取得 ID 為 1 的用戶數據。
    • 使用 POST 方法發送 JSON 數據到 http://localhost:3000/users 可以新增用戶。
      例如,使用 Postman 發送 POST 請求時,可以在 Body 中選擇 rawJSON,並輸入以下內容來新增用戶:
{
    "name": "Charlie"
}

你會看到新用戶被成功添加到數據庫中。

  1. Express.js 與資料庫的結合
    雖然這裡我們使用的是模擬數據(儲存在伺服器內存中),但在實際應用中,我們通常會將數據儲存在資料庫中。Express.js 可以輕鬆地與不同的資料庫整合,例如:

使用 mongoose 來與 MongoDB 進行溝通。
使用 mysql2 來與 MySQL 資料庫進行連接。
在後續的文章中,我們將探討如何將 Express.js 與資料庫整合,實現真正的數據持久化。

結論
今天我們介紹了 Express.js 這個輕量級框架,並學習了如何使用它構建一個簡單的 API。Express.js 強大的路由功能和中介軟件支持讓它成為構建現代 Web 應用後端的理想選擇。通過這篇文章,你應該對如何處理 API 請求和回應有了初步的了解。接下來,我們將進一步探討 Express.js 與資料庫的整合,讓數據真正實現持久化。


上一篇
Day-22 數據持久化 - 後端的簡單介紹與設置
下一篇
Day-24 數據庫入門:使用 MongoDB 儲存與讀取數據
系列文
新手友善園區-如何架設人生第一個網站30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言