晋升全栈之路 —— express 框架的使用-白红宇

晋升全栈之路 —— express 框架的使用

阅读量：232 次

发布时间：2019-03-01

本文共 4031 字，大约阅读时间需要 13 分钟。

Express框架简介

Express 是一款流行的 Node.js 框架，用于构建各种 Web 应用。通过 npm install express 即可下载并使用。它简化了 Node.js 网站配置，提供了一系列实用功能，帮助开发者快速创建高效的 Web 应用。

Express 的特点

简洁易用：提供了简便的路由配置方式，简化了 HTTP 请求的处理流程。

灵活扩展：支持中间件机制，允许开发者根据需求添加功能模块。

路由管理：提供了强大的路由配置能力，支持动态路由参数。

模板引擎支持：集成了 art-template 模板引擎，方便构建动态网页内容。

静态资源管理：支持通过 express.static 直接加载静态资源文件。

路由配置

Express 的路由配置是其核心功能之一。通过 app.get、app.post 等方法，可以为不同的 HTTP 请求方式定义路由规则。

例子：

const express = require('express')const app = express()const port = 3000app.get('/', (req, res, next) => {    res.send('Hello World!')    next()})app.listen(port, () => {    console.log(`Example app listening on port ${port}!`)})

解释：

app.get('/') 定义了当客户端访问 / 路径时的回调函数。

res.send('Hello World!') 用于向客户端返回响应数据。

app.listen() 启动服务器并输出监听地址和端口信息。

中间件（Middleware）

中间件是 Express 开发中的重要概念。它可以执行一系列操作，如数据处理、权限验证、日志记录等，然后将请求交给下一个中间件或路由处理。

例子：

const express = require('express')const app = express()const port = 3000// 检查用户是否登录app.use((req, res, next) => {    if (flag) {        next()    }    res.send('请登录')})app.get('/', (req, res) => {    res.send('Hello World!')})app.listen(port, () => {    console.log(`Example app listening on port ${port}!`)})

解释：

中间件可以根据需求拦截请求，例如判断用户是否登录。

如果登录成功，调用 next() 将请求继续传递到下一个中间件或路由；如果未登录，直接向客户端返回响应。

模块化路由

为了保持代码整洁，Express 提供了 Router 模块。通过将路由逻辑分离到不同文件中，可以更方便地管理和维护代码。

代码示例（分文件管理）：

// route/admin.jsconst express = require('express')const admin = express.Router()admin.use('/index', (req, res, next) => {    res.send('欢迎来到管理页面')})module.exports = admin

// route/home.jsconst express = require('express')const home = express.Router()home.use('/index', (req, res, next) => {    res.send('欢迎来到博客首页')})module.exports = home

// app.jsconst express = require('express')const app = express()const port = 3000const admin = require('./route/admin')const home = require('./route/home')app.use('/admin', admin)app.use('/home', home)app.listen(port, () => {    console.log(`Example app listening on port ${port}!`)})

解释：

每个路由文件导出一个 Router 实例。

在 app.js 中，通过 use 方法将路由对象绑定到特定路径，例如 '/admin' 和 '/home'。

当客户端访问 localhost:3000/admin 时，会使用 admin 路由处理。

参数获取

Express 提供了便捷的方法来获取和处理 HTTP 请求参数。

GET 参数获取

const express = require('express')const app = express()const port = 3000app.get('/', (req, res) => {    console.log(req.query)    res.send('Hello World!')})app.listen(port, () => {    console.log(`Example app listening on port ${port}!`)})

解释：

req.query 是一个对象，存储 GET 请求中携带的参数。

例如，浏览器输入 localhost:3000?msg=asdasd，则 req.query 会输出 { msg: 'asdasd' }。

POST 参数获取

需要使用 body-parser 模块：

const express = require('express')const body_parser = require('body-parser')const app = express()const port = 3000app.use(body_parser.urlencoded({ extended: false }))app.post('/add', (req, res) => {    console.log(req.body)})app.listen(port, () => {    console.log(`Example app listening on port ${port}!`)})

解释：

body_parser.urlencoded({ extended: false }) 用于解析 POST 请求中的 URL 编码数据。

req.body 属性存储了 POST 请求的请求体数据，可以是字符串、数组或对象。

静态资源访问

Express 提供了便捷的方法来加载静态资源文件。例如，使用 express.static 可以直接加载 public 文件夹中的静态资源。

代码示例：

const express = require('express')const app = express()const port = 3000app.use(express.static('public'))app.listen(port, () => {    console.log(`Example app listening on port ${port}!`)})

解释：

express.static('public') 将 public 文件夹中的资源直接映射到 Web 服务器。

客户端可以通过 localhost:3000/index.html 访问 public 文件夹中的 index.html 文件。

模板引擎配置

Express 支持多种模板引擎，常用的有 art-template。以下是使用 art-template 的配置方法：

代码示例：

const express = require('express')const path = require('path')const app = express()const port = 3000// 配置模板引擎app.engine('art', require('express-art-template'))app.set('views', path.join(__dirname, 'views'))app.set('view engine', 'art')app.get('/', (req, res) => {    res.render('index', {        msg: '这是 index 模板'    })})app.listen(port, () => {    console.log(`Example app listening on port ${port}!`)})

解释：