Express 核心概念?

Express是基于Node.js的輕量級Web框架，封裝了HTTP服務、路由管理、中間件等核心功能，簡化了Web應用和API開發
核心優勢??

• 中間件架構：支持模塊化請求處理流程
• 路由系統：直觀的URL到處理函數的映射
• 高性能：非阻塞I/O模型與事件驅動機制

基礎使用?

• 安裝express

npm init
npm i express

• 快速入門

// index.js
const express = require('express');
const port = 3000;
const app = express();app.get('/a',(req,res)=>{res.send("Welcome to a Page");
})app.listen(port,()=>{console.log("Server is running on port 3000"); 
})
//執行
// node index.js
// nodemon index.js
// npm run start //package.json中配置

• 瀏覽器訪問
  

express 路由

路由確定了應用程序如何響應客戶端對特定端點的請求

• 路由使用

const express = require('express');
const app = express();// GET 路由
app.get('/home', (req, res) => {res.send('網站首頁');
});// 根路由
app.get('/', (req, res) => {res.send('首頁');
});// POST 路由
app.post('/login', (req, res) => {res.send('登錄成功');
});
// 路徑參數（規范寫法）
app.get('/users/:userId', (req, res) => {res.send(`User ID: ${req.params.userId}`); 
});// 全方法路由
app.all('/search', (req, res) => {res.send('1秒鐘為您找到相關結果約100,000,000個');
});// 多方法路由鏈
app.route('/books').get((req, res) => res.send('Get Books')).post((req, res) => res.send('Add Book'));// 404 路由
app.all('*', (req, res) => {res.send('<h1>404 Not Found</h1>');
});app.listen(3000);

?注意：?
路由路徑語法沖突??app.all(':page(.)')中的 (.)被解析為正則表達式，但 ??path-to-regexp要求正則部分必須用 /包裹??。當前寫法 :page(.*)會被解析為：

• :page→ 命名參數
• (.*)→ 未閉合的正則片段（缺少起始 /），觸發語法錯誤 Unexpected

獲取請求參數

app.get('/request', (req, res) => {// 獲取報文的方式與原生 HTTP 獲取方式是兼容的console.log(req.method); // GETconsole.log(req.url); // /requestconsole.log(req.httpVersion); // 1.1console.log(req.headers); // 請求頭// / express 獨有的獲取報文的方式console.log(req.query); // 查詢字符串console.log(req.get('host')); // 獲取指定的請求頭res.send('請求報文的獲取');
});// 路徑參數
app.get('/users/:userId', (req, res) => {res.send(`User ID: ${req.params.userId}`); 
});

express 響應設置

app.get("/response", (req, res) => {// 原生HTTP方式res.statusCode = 404;res.statusMessage = 'Not Found';res.setHeader('abc', 'xyz');res.write('響應體');res.end('結束');// Express方式res.status(500); // 狀態碼res.set('xxx', 'yyy'); // 響應頭res.send('中文響應不亂碼'); // 響應體// 鏈式調用res.status(404).set('xxx', 'yyy').send('你好朋友');// 其他響應res.redirect('http://example.com'); // 重定向res.download('./package.json'); // 文件下載res.json({name: 'John'}); // JSON響應res.sendFile(__dirname + '/home.html'); // 發送文件
});

注意：出現亂碼的情況

• 響應體中出現亂碼
  • 響應頭中設置 Content-Type: text/plain; charset=utf-8

  res.writeHead(200, {'Content-Type': 'text/html; charset=utf-8' // 明確指定 UTF-8});res.write('響應體');res.end('結束');

express 中間件

中間件（Middleware）本質是一個回調函數，可以訪問請求對象（request）和響應對象（response）

• 全局中間件

// 定義中間件
const logger = (req, res, next) => {console.log(`${new Date().toISOString()} - ${req.method} ${req.url}`);next();
};// 應用中間件
app.use(logger);// 多個全局中間件
app.use((req, res, next) => {console.log('中間件1');next();
});app.use((req, res, next) => {console.log('中間件2');next();
});

• 路由中間件

// 路由中間件（身份驗證）
const authMiddleware = (req, res, next) => {if (req.query.token === '123') next();else res.status(401).send('Unauthorized');
};
const logMiddleware = (req, res, next) => {console.log('日志記錄');next(); 
}
// 單個中間件
app.get('/admin', authMiddleware, (req, res) => {res.send('管理員頁面--');
});// 多個中間件
app.get('/dashboard', authMiddleware, logMiddleware, (req, res) => {res.send('控制面板--');}
);

• 靜態資源中間件

// public目錄作為靜態資源根目錄
app.use(express.static('./public')); // 動態路由（注意順序問題）
app.get('/index.html', (req, res) => {res.send('動態首頁');
});

• 關鍵內置中間件?

// 解析請求體（JSON）
app.use(express.json());// 解析請求體（表單數據）
app.use(express.urlencoded({ extended: true }));// 解析Cookie
app.use(cookieParser());
// 解析Session（需要額外配置）
app.use(session({ secret: 'secret', resave: false, saveUninitialized: true }));// 托管靜態資源（public目錄）
app.use(express.static('public'));

• 請求體解析中間件

npm i body-parserconst bodyParser = require('body-parser');// 處理表單數據
app.use(bodyParser.urlencoded({ extended: false }));// 處理JSON數據
app.use(bodyParser.json());app.post('/login', (req, res) => {console.log(req.body.username);console.log(req.body.password);res.send('登錄成功');
});

Router 路由模塊化

• 創建路由模塊

//routes/userRouter.js
const express = require('express');
const router = express.Router();router.get('/', (req, res) => {res.send('用戶首頁');
});router.get('/list', (req, res) => {res.send('用戶列表');});router.get('/:id', (req, res) => {res.send(`用戶詳情: ${req.params.id}`);
});module.exports = router;

• 主文件使用路由

const express = require('express');
const app = express();
const userRouter = require('./routes/userRouter');app.use('/users', userRouter);app.listen(3000);// 返回地址：
//  http://localhost:3000/users/   -> 用戶首頁
//  http://localhost:3000/users/list   -> 用戶列表
//  http://localhost:3000/users/11 -> 用戶詳情: 11