Express.js路由详解

简介: 版权声明:本文为博主chszs的原创文章,未经博主允许不得转载。 https://blog.csdn.net/chszs/article/details/51055229 Express.js路由详解作者:chszs,未经博主允许不得转载。
版权声明:本文为博主chszs的原创文章,未经博主允许不得转载。 https://blog.csdn.net/chszs/article/details/51055229

Express.js路由详解

作者:chszs,未经博主允许不得转载。经许可的转载需注明作者和博客主页:http://blog.csdn.net/chszs

Express路由模块

Express的路由模块是由一个URI(或者叫路径)和一个特定的HTTP方法(比如GET、POST等)组成的,表示应用该如何响应客户端对指定URI的访问。
每一个路由都可以有一个或多个处理函数,当匹配到路由时,将执行相应的函数。
路由的定义由如下结构组成:

app.METHOD(PATH, HANDLER)

其中,app表示一个express实例;METHOD是HTTP的请求方法;PATH是服务器端的路径,即URI;HANDLER表示当路由匹配时需要执行的函数。比如:

app.get('/', function (req, res) {
  res.send('Hello World!');
});

// 网站首页接受 POST 请求
app.post('/', function (req, res) {
  res.send('Got a POST request');
});

// /user 节点接受 PUT 请求
app.put('/user', function (req, res) {
  res.send('Got a PUT request at /user');
});

// /user 节点接受 DELETE 请求
app.delete('/user', function (req, res) {
  res.send('Got a DELETE request at /user');
});

curl测试

测试以上代码,用curl工具。

测试GET请求
$ curl -G http://localhost:3000/
或者用
curl -X GET http://localhost:3000/
测试POST请求
$ curl -d "" http://localhost:3000/
或者用
$ curl -X POST http://localhost:3000/
测试PUT请求
C:\>curl -X PUT http://localhost:3000/
测试DELETE请求
C:\>curl -X DELETE http://localhost:3000/

请求方法

Express定义了与HTTP请求对应的路由方法,包括:get, post, put, head, delete, options, trace, copy, lock, mkcol, move, purge, propfind, proppatch, unlock, report, mkactivity, checkout, merge, m-search, notify, subscribe, unsubscribe, patch, search和connect。

app.all()

app.all()是一个特殊的路由方法,没有任何HTTP方法与其对应,它的作用是对于一个路径上的所有请求加载中间件。
在下面的例子中,只要是来自“/secret”的请求,不管使用GET、POST、PUT、DELETE或其他任何http模块支持的HTTP请求,句柄都会得到执行。

app.all('/secret', function (req, res, next) {
  console.log('Accessing the secret section ...');
  next(); // pass control to the next handler
});

Express的路由路径和请求方法一起定义了请求的端点,它可以是字符串、字符串模式或者正则表达式。

Express Route Tester工具

Express使用了path-to-regexp来匹配路由路径。另外,Express Route Tester是测试基本Express路径的好工具,但它不支持模式匹配。

Express Route Tester工具见 http://forbeslindesay.github.io/express-route-tester/
这里写图片描述

path-to-regexp工具

path-to-regexp是Express风格的路径正则工具,见 https://www.npmjs.com/package/path-to-regexp
Express内部依赖了此工具,故无需单独安装。

path-to-regexp的用法

var pathToRegexp = require('path-to-regexp')
// pathToRegexp(path, keys, options)
// pathToRegexp.parse(path)
// pathToRegexp.compile(path)

其中,

  • path指express格式中的一个字符串、或一个字符串数组、或一个正则表达式
  • keys指对URL中的关键词进行填充的数组
  • options有三个值:
    • sensitive 如果为true表示URL是大小写敏感的,默认为false
    • strict 如果为false表示URL最后的斜线“/”是可省略的,默认为false
    • end 如果为false表示路径会从头匹配,默认为false

path-to-regexp中的参数

1)命名参数
命名此参数使用“:”加上参数名的方式来定义,比如“:foo”

2)后缀参数

  • 可选的后缀参数
    使用符号“?”再紧跟参数,说明整个参数是可选的,前面还可以结合“/”或“.”一起使用,比如:

‘’

var re = pathToRegexp('/:foo/:bar?', keys)
// keys = [{ name: 'foo', ... }, { name: 'bar', delimiter: '/', optional: true, repeat: false }] 
  • 零到多个
    使用“*”号

‘’

var re = pathToRegexp('/:foo*', keys)
// keys = [{ name: 'foo', delimiter: '/', optional: true, repeat: true }] 
  • 1到多个
    使用“+”号

‘’

var re = pathToRegexp('/:foo+', keys)
// keys = [{ name: 'foo', delimiter: '/', optional: false, repeat: true }] 
  • 自定义匹配参数
    还可以用正则表达式自定义匹配参数。

‘’

var re = pathToRegexp('/:foo(\\d+)', keys)
// keys = [{ name: 'foo', ... }] 
  • 未命名的参数
    URL中出现未命名的参数也是可以的,比如:

‘’

var re = pathToRegexp('/:foo/(.*)', keys)
// keys = [{ name: 'foo', ... }, { name: '0', ... }] 
  • 星号
    用星号“*”来匹配子路径的一切,比如:

‘’

var re = pathToRegexp('/foo/*', keys)
// keys = [{ name: '0', ... }] 

路径匹配例子:

// 匹配 /random.txt 路径的请求
app.get('/random.txt', function (req, res) {
  res.send('random.txt');
});

// 匹配 qcd 和 qbcd
app.get('/qb?cd', function(req, res) {
  res.send('qb?cd');
});

// 匹配 qbcd、qbbcd、qbbbcd等
app.get('/qb+cd', function(req, res) {
  res.send('qb+cd');
});

// 匹配 qbcd、qbxcd、qbRABDOMcd、qb123cd等
app.get('/qb*cd', function(req, res) {
  res.send('qb*cd');
});

// 匹配 /qbe 和 /qbcde
app.get('/qb(cd)?e', function(req, res) {
 res.send('qb(cd)?e');
});

// 匹配任何路径中含有 q 的路径:
app.get(/q/, function(req, res) {
  res.send('/q/');
});

// 匹配 butterfly、dragonfly,不匹配 butterflyman、dragonfly man等
app.get(/.*fly$/, function(req, res) {
  res.send('/.*fly$/');
});

Express的链式路由

可使用app.route()创建路由路径的链式路由句柄。由于路径在一个地方指定,这样做有助于创建模块化的路由,而且减少了代码冗余和拼写错误。

app.route('/car')
  .get(function(req, res) {
    res.send('Get a random car');
  })
  .post(function(req, res) {
    res.send('Add a car');
  })
  .put(function(req, res) {
    res.send('Update the car');
  });
目录
相关文章
|
4月前
|
JavaScript 前端开发 开发者
Vue.js 框架大揭秘:响应式系统、组件化与路由管理,震撼你的前端世界!
【8月更文挑战第27天】Vue.js是一款备受欢迎的前端JavaScript框架,以简洁、灵活和高效著称。本文将从三个方面深入探讨Vue.js:响应式系统、组件化及路由管理。响应式系统为Vue.js的核心特性,能自动追踪数据变动并更新视图。例如,通过简单示例代码展示其响应式特性:`{{ message }}`,当`message`值改变,页面随之自动更新。此外,Vue.js支持组件化设计,允许将复杂界面拆分为独立且可复用的组件,提高代码可维护性和扩展性。如创建一个包含标题与内容的简单组件,并在其他页面中重复利用。
81 3
|
17天前
|
缓存 前端开发 JavaScript
JavaScript前端路由的实现原理及其在单页应用中的重要性,涵盖前端路由概念、基本原理、常见实现方式
本文深入解析了JavaScript前端路由的实现原理及其在单页应用中的重要性,涵盖前端路由概念、基本原理、常见实现方式(Hash路由和History路由)、优点及挑战,并通过实际案例分析,帮助开发者更好地理解和应用这一关键技术,提升用户体验。
47 1
|
2月前
|
JavaScript
Node.js 路由
10月更文挑战第5天
24 2
|
2月前
|
JavaScript 前端开发 API
前端技术分享:Vue.js 动态路由与守卫
【10月更文挑战第1天】前端技术分享:Vue.js 动态路由与守卫
|
2月前
|
资源调度 JavaScript UED
如何使用Vue.js实现单页应用的路由功能
【10月更文挑战第1天】如何使用Vue.js实现单页应用的路由功能
|
3月前
|
缓存 JavaScript 中间件
优化Express.js应用程序性能:缓存策略、请求压缩和路由匹配
在开发Express.js应用时,采用合理的缓存策略、请求压缩及优化路由匹配可大幅提升性能。本文介绍如何利用`express.static`实现缓存、`compression`中间件压缩响应数据,并通过精确匹配、模块化路由及参数化路由提高路由处理效率,从而打造高效应用。
184 13
|
3月前
|
JavaScript
Vue3基础(21)___在axios.js中使用路由跳转
本文介绍了在Vue 3中如何在axios.js中使用路由跳转,通过直接引入路由实例并使用`router.push`实现页面跳转。
140 0
|
4月前
|
JSON 数据安全/隐私保护 数据格式
Nest.js 实战 (八):基于 JWT 的路由身份认证鉴权
这篇文章介绍了身份验证的重要性和多种处理策略,重点放在了JWT(JSON Web Token)认证在Nest.js框架中的应用。文章包含了JWT认证的流程,如何在Nest.js中实现,以及如何创建JWT认证策略。包括了安装依赖,创建处理认证流程的文件,以及如何使用HttpException过滤器来处理未登录访问。
222 0
Nest.js 实战 (八):基于 JWT 的路由身份认证鉴权
|
4月前
|
JavaScript 前端开发 UED
揭秘Vue.js高效开发:Vue Router如何让单页面应用路由管理变得如此简单?
【8月更文挑战第30天】随着Web应用复杂性的增加,单页面应用(SPA)因出色的用户体验和高效的页面加载性能而备受青睐。Vue.js凭借简洁的语法和灵活的组件系统成为构建SPA的热门选择,其官方路由管理器Vue Router则简化了路由管理。本文通过实战示例介绍如何利用Vue Router实现高效的SPA路由管理,包括命名路由、动态路由及其核心优势。
41 0
|
5月前
|
JavaScript 前端开发 API
前端框架与库 - Vue.js 组件与路由
【7月更文挑战第15天】Vue.js 框架以简洁API和高效DOM更新著名,组件和路由是构建应用的关键。组件是自包含的实例,常见问题包括命名冲突、作用域混淆和状态管理。要避免这些问题,可使用命名空间、明确数据绑定和事件,以及采用Vuex管理状态。Vue Router提供声明式路由,常见挑战包括路由守卫、动态路由参数和懒加载配置。正确使用路由守卫、处理动态参数和实现代码分割能优化路由管理。提供的代码示例展示了基本组件和路由配置。
51 1