2020-12-01

Express

Express中文网

基于 Node.js 平台，快速、开放、极简的 Web 开发框架

Express 是一个简洁而灵活的 node.js Web应用框架, 提供了一系列强大特性帮助你创建各种 Web 应用，和丰富的 HTTP 工具。

使用 Express 可以快速地搭建一个完整功能的网站。

Express 框架核心特性：

• 可以设置中间件来响应 HTTP 请求。
• 定义了路由表用于执行不同的 HTTP 请求动作。
• 可以通过向模板传递参数来动态渲染 HTML 页面。
• 总结

- 什么是Express.js：是一个基于Node.js的Web开发框架。Express框架并没有覆盖或删除原生的API，而是基于原生的API，做了进一步的封装，提供了更好用的一些API，方便快速进行Web开发！
Node.js是Javascript的服务器端运行环境！express只是在Node基础上，提供了开发Web应用的框架和API，意味着使用express,可以让我们的web开发更高效。

Express的基本使用

npm install express -S;// 先下载安装express框架

使用 (搭建一个最最基本的web服务器)

// 1. 引入框架模块
let express = require('express')

// 2. 创建服务器
let app = express();

// 3. 开启服务器并监听端口
app.listen(3000,()=>{
  console.log('express server is running at http://127.0.0.1:3000');
})

// 4.给app对象注册中间件,监听请求
// use是一个中间件,可以用来监听get和post请求
app.use((req,res)=>{
  // res.end('express框架的基本使用...');// 直接返回带有中文的内容会有乱码 加响应头后可以解决

  res.send('express框架的基本使用...') ;// 可以直接返回中文并解析不会出现乱码
})

中间件的基本概念

**概念
中间件是一个函数，他可以访问请求对象web 应用中处于请求-响应循环流程中的中间件，一般被命名为 next 的变量。

经过中间件的处理之后，express就向 req 和 res ,对象身上，挂在了一些好用的方法和属性,我们在进行开发的时候可以直接调用。中间件的常见功能包括：

• 执行任何代码。
• 修改请求和响应对象。
• 终结请求-响应循环。
• 调用堆栈中的下一个中间件。
• …
  - 接收get和post的不同的请求
  可以给app注册不同的中间件，来接收不同的请求
  这个也可以算是一个基本的路由功能：

路由(Routing)是由一个URL(或者叫做路径)和一个特定的HTTP方法(GET、POST等)组成的，涉及到应用如何响应客户端对某个网站节点的访问。
每一个路由都可以有一个或者多个处理器函数，当匹配到路由时，这(个/些)函数将被执行。

路由的定义由如下结构组成：app.method(routerPath,handler)

其中，app是一个express实例；
method是某个HTTP请求方式中的一个;
routerPath是服务器端的路径;
handler是当路由匹配到时需要执行的函数。

示例如下:

// 1. 引入框架模块
let express = require('express')

// 2. 创建服务器
let app = express();

// 3. 开启服务器并监听端口
app.listen(3000,()=>{
  console.log('express server is running at http://127.0.0.1:3000');
})

// 4.给app对象注册中间件,监听请求
// use是一个中间件,可以用来监听get和post请求
//next可以接着进行下一个函数
app.get('/',(req,res,next)=>{
  res.send('这是一个index的主页面...')
})

app.get('/movie', (req, res) => {
  res.send('这是一个电影的主页面...')
})

app.post('/login', (req, res) => {
  res.send('这是一个登陆的主页面...')
})

express-art-template模板引擎介绍(了解)

这里简单的介绍一下express-art-template在express中的使用
不管以后开发时使用那种模板引擎，大致的使用方式都是一样的
使用步骤：

• 下载安装
  • 先下载art-template: npm i art-template
  • 再下载express-art-template: npm i express-art-template
• 给express框架设置默认的模板引擎

// 注册模板引擎
app.engine('html', require('express-art-template'));
app.set('view options', {
    debug: process.env.NODE_ENV !== 'production'
});

设置模板引擎文件的默认路径

// 如果不设置，默认也是views
app.set('views','./views')

示例如下:

// 1. 引入框架模块
let express = require('express')

// 2. 创建服务器
let app = express();

// 注册模板引擎
app.engine('html', require('express-art-template'));
app.set('view options', {
    debug: process.env.NODE_ENV !== 'production'
});
// 如果不设置，默认也是views
app.set('views','./views')

// 3. 开启服务器并监听端口
app.listen(3000,()=>{
    console.log('http://127.0.0.1:3000')
})

app.get('/',function(req,res){
    // 引入express-art-template之前，会在Res上挂载一个render方法，可以实现页面的渲染
    res.render('index.html')
})

express.static托管静态资源
利用Express内置的express.static可以方便地托管静态文件,例如图片、CSS、JavaScript文件等。

将静态资源 文件所在的目录作为参数传递给express.static中间件就可以提供静态资源文件的访问了.

例如,假设在public目录放置了图片、CSS和JavaScript文件,你就可以:

app.use(express.static('public'));

现在public目录下面的文件就可以访问了。

http://localhost:3000/images/kitten.jpg
http://localhost:3000/css/style.css
http://localhost:3000/js/app.js
http://localhost:3000/images/bg.png
http://localhost:3000/images/hello.html
//所有文件的路径都是相对于存储目录的,因此存放静态文件的目录名不会出现在URL中.

如果你的静态资源存储在多个目录下面,你可以多次调用express.static中间件:

app.use(express.static('public'));
app.use(express.static('files'));

访问静态资源文件时,express.static中间件会根据目录添加的顺序查找所需的文件.

如果你希望所有通过express.static访问的文件都存放在一个"虚拟(virtual)"目录(即目录根本不存在)下面,可以通过为静态资源目录指定一个挂载路径的方式来实现,如下所示:

app.use('/static'express.static('public'));

现在，你就可以通过带有“/static"前缀的地址来访问public目录下面的文件了.

http://localhost:3000/static/images/kitten.jpg
http://localhost:3000/static/css/style.css
http://localhost:3000/static/js/app.js
http://localhost:3000/static/images/bg.png
http://localhost:3000/static/images/hello.html

示例：

// 1. 引入框架模块
let express = require('express')

// 2. 创建服务器
let app = express();

// 注册模板引擎
app.engine('html', require('express-art-template'));
app.set('view options', {
    debug: process.env.NODE_ENV !== 'production'
});
// 如果不设置，默认也是views
app.set('views','./views')

// 托管静态资源
app.use('/css', express.static('css'))
app.use('/js', express.static('js'))
// 也可以将所有静态资源放置到指定的目录下，如public,然后添加以下的配置
// app.use(express.static('public'))

// 3. 开启服务器并监听端口
app.listen(3000,()=>{
    console.log('http://127.0.0.1:3000')
})

app.get('/',function(req,res){
    // 引入express-art-template之前，会在Res上挂载一个render方法，可以实现页面的渲染
    res.render('index.html')
})

还有一种常见的静态资源托管方式，能够让我们方便的访问当前服务器中的页面

// 下面这个中间件可以实现当前服务器内部的静态页面的相互访问，我们只需要将前端页面或资源放到服务器的某个目录下，并配置静态资源访问。
// 第一个参数 /：表示用 http://127.0.0.1:3000/ 即可访问到 views 这级目录
// 我们可以将当前网站的页面资源放置到这个views中，方便我们的访问
// 经过下面的配置，我们可以做到，当在地址栏中输入http://127.0.0.1:3000后，就会自动的打开views目录下的index.html文件
app.use('/', express.static(path.join(__dirname, 'views')))

express.Router创建路由
express.Router
可使用express.Router类创建模块化、可挂载的路由句柄。Router实例是一个完整的中间件和路由系统，因此常称其为一个"mini-app"。

下面的实例程序创建了一个路由模块,并加载了一个中间件,定义了一些路由，并且将它们挂载至应用的路径上。

在项目目录下创建名为05-router.js的文件，内容如下:

//这个文件用于封装路由器
//1导入模块
let express=requir("express")
//创建一个路由器
let router=express.Router()
router.get("/",function(req,res,next){
// 引入express-art-template之前，会在Res上挂载一个render方法，可以实现页面的渲染
res.render("index.html"）
})
// 配合body-parser所添加的路由
router.post("./addUesr",function(req,res,next){
 // 接收post请求方式的参数
 obj=req.body
 console.log(obj)
 res.send("ok")
}）
//暴露
moduler.exports=rotuer
}

在app.js中的内容如下:

// 1. 引入框架模块
const express = require('express')

// 引入路由模块
const router = require('./05-router.js')

// 2. 创建服务器
const app = express();

// 注册模板引擎
app.engine('html', require('express-art-template'));
app.set('view options', {
    debug: process.env.NODE_ENV !== 'production'
});
// 如果不设置，默认也是views
app.set('views','./views')

// 托管静态资源
app.use('/css', express.static('css'))
app.use('/js', express.static('js'))
// 也可以将所有静态资源放置到指定的目录下，如public,然后添加以下的配置
// app.use(express.static('public'))

// 3. 开启服务器并监听端口
app.listen(3000,()=>{
    console.log('http://127.0.0.1:3000')
})

// 路由不在这个位置创建了，而是封装到一个路由模块中
// app.get('/',function(req,res){
//     // 引入express-art-template之前，会在Res上挂载一个render方法，可以实现页面的渲染
//     res.render('index.html')
// })
// 注册路由
app.use(router)

再说中间件

Express是一个自身功能极简,完全是由路由和中间件构成的一个web开发框架。
从本质上来说，一个Express应用就是在调用各种中间件.
Express应用可使用如下几种中间件:

• 应用级中间件
• 路由级中间件
• 错误处理中间件
• 内置中间件
• 第三方中间件
• 应用级中间件
  应用级中间件绑定到app对象,使用app.use()和app.METHOD(),其中,METHOD是需要处理的HTTP请求的方法，例如GET,POST,PUT等，全部小写.例如:

var app = express()

// 没有挂载路径的中间件,应用的每个请求都会执行该中间件
app.use((req,res,next)=>{
  console.log('Time:',Date.now());
  next();
})

// 挂载至 /user/:id的中间件,任何指向/user/:id的请求都会执行它
app.use('/user/:id',(req,res,next)=>{
  console.log('Request Type',req.method);
  next()
})

// 路由和句柄函数(中间件系统),处理指向/user/:id的GET请求
app.get('/user/:id',(req,res,next)=>{
  res.rend('USER')
})

路由级中间件

路由级中间件和应用级中间件一样,只是它绑定的对象为express.Router()

let rotuer=express.Rotuer

路由级使用router.use()或router.VERB()加载。

上述在应用级创建的中间件系统,可通过如下代码改写为路由级:

let app=express()
let router=express.Router()
// 没有挂载路径的中间件,通过该路由的每个请求都会执行该中间件
router.use((req,res,next)=>{
console.log("Time:",Date.now())
next()
// 一个中间件栈,显示任何指向/user/:id的HTTP请求的信息
router.use('/user/:id',(req,res,next)=>{
    console.log('Request URL:',req.originalUrl);
    next();
},(req,res,next)=>{
    console.log('Request Type',req.method);
    next();
})
}
)

错误处理中间件

错误处理中间件有4个参数，定义错误处理中间件时必须使用这4个参数。即使不需要next对象,也必须在签名中声明它，否则中间件会被识别为一个常规中间件，不能处理错误。

错误处理中间件和其他中间件定义类似，只是要使用4个参数，而不是3个，其签名如下：（err,req,res,next）

app.use((err,req,res,next)=>{
    console.error(err.stack);
    res.status(500).send('404')
})

内置中间件

从4.x版本开始，除了express.static，Express以前内置的中间件现在已经全部单独作为模块安装使用了.

express.static(root,[options])

express.static是Express唯一内置的中间件。它基于server-static,负责在Express应用中托管静态资源。

第三方中间件

通过使用第三方中间件从而为Express应用增加更加功能

安装所需要功能的node模块,并在应用中加载，可以在应用级加载，也可以在路由级加载。

下面的例子安装并加载了一个接收post方式所传递的参数的中间件：body-parser

npm install body-parser

var bodyParser = require('body-parser')
// 添加body-parse解析器
app.use(bodyParser.json())
app.use(bodyParser.urlencoded({ extended: false }))