---
# System prepended metadata

title: Express.js
tags: [docs]

---

# Express.js
## 1. 什麼是 Express.js？

Express.js 是一個基於 Node.js 的輕量級 Web 應用框架。
它簡化了 Web 伺服器的搭建過程，讓開發者可以更快速地構建 Web 應用或 API。

### Express.js 的特點包括：
- 極簡的 API，適合構建輕量級應用。
- 支援中介軟體（Middleware），方便處理請求和回應。
- 可擴展性強，與其他 Node.js 模組兼容良好。

## 2. 安裝 Express.js

首先，確保你已經安裝了 Node.js 和 npm（Node.js 的包管理器）。
接著，在一個新的專案資料夾中執行以下命令來安裝 Express.js：

```bash=
npm init -y  # 初始化 npm 專案
npm install express --save  # 安裝 Express.js
```
## 3. 基本應用結構

使用 Express.js，創建一個基本的 Web 伺服器非常簡單。

以下是最小化的 Express 應用：

```javascript=
const express = require('express');
const app = express();
const port = 3000;

app.get('/', (req, res) => {
    res.send('Hello, Express.js!');
});

app.listen(port, () => {
    console.log(`伺服器正在運行於 http://localhost:${port}`);
});
```
這個範例程式：

* 建立一個 Express 應用程式 `app`。
* 使用 `app.get()` 定義一個路由來處理根目錄 `/` 的 HTTP GET 請求，並回應文字 "Hello, Express.js!"。
* 使用 `app.listen()` 開啟伺服器，並監聽端口 `3000`。

## 4. 路由（Routing）

Express.js 提供了靈活的路由機制，可以針對不同的 URL 路徑處理不同的請求。

範例：
```javascript=
app.get('/about', (req, res) => {
    res.send('這是關於頁面');
});

app.post('/submit', (req, res) => {
    res.send('表單已提交');
});
```

* `GET` 請求：用於讀取資源，如顯示頁面內容。
* `POST` 請求：用於提交數據，如表單。
## 5. 中介軟體（Middleware）

中介軟體是 Express.js 中處理請求和回應的一部分，可以用來實現如身份驗證、錯誤處理等功能。

範例：
```javascript=
app.use((req, res, next) => {
    console.log('收到一個請求');
    next();  // 繼續處理
});
```
* `next`：當middleware完成時呼叫的程式
### Express 中的常見中介軟體
* `express.json()`: 解析傳入的 JSON 請求體，並將其放入 req.body 中。
* `express.urlencoded()`: 解析 URL 編碼的表單數據。
* `express.static()`: 提供靜態文件，如 HTML、CSS、JavaScript 檔案。
* 自定義中介軟體: 開發者可以根據需求編寫自己的中介軟體。
## 6. 處理 JSON 和表單數據

Express.js 可以輕鬆處理 JSON 和表單數據，必須使用內建的中介軟體：

```javascript=
app.use(express.json());  // 處理 JSON 數據
app.use(express.urlencoded({ extended: true }));  // 處理表單數據

app.post('/submit', (req, res) => {
    console.log(req.body);  // 讀取提交的數據
    res.send('數據已接收');
});
```


## 7. 錯誤處理

Express.js 中可以使用中介軟體來處理錯誤：

```javascript= 
app.use((err, req, res, next) => {
    console.error(err.stack);
    res.status(500).send('伺服器錯誤！');
});
```


## 8. 靜態檔案服務

可以使用 Express 來提供靜態檔案，如 HTML、CSS、圖片等：

```javascript=
app.use(express.static('public'));  // 提供 public 資料夾中的靜態檔案
```


## 9. 路由參數

Express 可以使用路由參數來動態處理不同的請求：

```javascript=
app.get('/user/:id', (req, res) => {
    const userId = req.params.id;
    res.send(`使用者 ID: ${userId}`);
});
```


## 10. 結合 MongoDB（選用）

Express.js 經常與 MongoDB 一起使用來實現數據庫操作。可以透過 mongoose 來連接 MongoDB：

```bash=
npm install mongoose --save  # 安裝 mongoose
```

以下是連接 MongoDB 的範例：

```javascript=
const mongoose = require('mongoose');
mongoose.connect('mongodb://localhost:27017/mydatabase', {
    useNewUrlParser: true,
    useUnifiedTopology: true
}).then(() => {
    console.log('成功連接到 MongoDB');
}).catch(err => {
    console.error('連接 MongoDB 失敗', err);
});
```