路由:
路由定义了如何响应客户端请求以及响应结束点。
路由是URI的组成部分,包含http请求方法,和一个或多个处理方法。路由的结构为“app.METHOD(path,[callback...],callback)"。”app“是一个express实例,”METHOD“为http请求方法,”path“是服务路径,”callback“路径匹配时执行的方法。
下面是一个非常基础的路由示例:
var express = require('express') var app = express() // respond with "hello world" when a GET request is made to the homepage app.get('/', function(req, res) { res.send('hello world') })
路由方法:
路由方法衍生于HTTP方法,是express实例的属性。
下面是关于路由的一个例子,定义了应用根路径的GET和POST方法:
// GET method route app.get('/', function (req, res) { res.send('GET request to the homepage') }) // POST method route app.post('/', function (req, res) { res.send('POST request to the homepage') })
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。
使用方括号([ ])记法,可以通过javascript变量名调用路由方法,例如: app.['m-search']('/',function...)
这里有个一个特殊的路由方法”app.all()",不衍生于任何HTTP方法。它被用于为所有请求方法的路径加载中间件。
例如,下面的例子中,使用GET,POST,PUT,DELETE或“http module”模块提供的其他HTTP请求方法访问“/secret”路径时,将运行处理方法。
app.all('/secret', function (req, res, next) { console.log('Accessing the secret section ...') next() // pass control to the next handler })
路由路径:
路由路径,结合路由方法,定义了请求的端点以及哪一类请求可以访问。路径可以是字符串,字符串模式或者正则表达式。
备注:Express使用“path-to-regexp”来匹配路径,关于路径的详细信息可以参考它的文档。“Express Route Tester”是测试Express路由的处理工具。
注意:查询字符串不是路由路径的一部分。
下面是字符串路由路径的例子:
// 匹配根“/”路径 app.get('/', function (req, res) { res.send('root') }) // 匹配“/about”路径 app.get('/about', function (req, res) { res.send('about') }) // 匹配"/random.text"路径 app.get('/random.text', function (req, res) { res.send('random.text') })
下面是字符串模式路由路径的例子:
// will match acd and abcd app.get('/ab?cd', function(req, res) { res.send('ab?cd') }) // will match abcd, abbcd, abbbcd, and so on app.get('/ab+cd', function(req, res) { res.send('ab+cd') }) // will match abcd, abxcd, abRABDOMcd, ab123cd, and so on app.get('/ab*cd', function(req, res) { res.send('ab*cd') }) // will match /abe and /abcde app.get('/ab(cd)?e', function(req, res) { res.send('ab(cd)?e') })
备注:字符?,+,*和()是Express中正则表达式的子集.连字符(-)和点号(.)基于字符串路径逐字解释.
下面是正则表达式路由路径的例子:
// will match anything with an a in the route name: app.get(/a/, function(req, res) { res.send('/a/') }) // will match butterfly, dragonfly; but not butterflyman, dragonfly man, and so on app.get(/.*fly$/, function(req, res) { res.send('/.*fly$/') })
路由处理方法:
你可以针对一个请求提供多个回调函数,它们的行为就像中间件.这里有一个特殊情况: 当回调函数调用"next('route')"时,就会忽略剩余的回调函数.你可以利用这个机制给路径添加先决条件;满足条件则执行后续的路径,不满足条件则继续执行当前路径.
路由处理可以是单个的函数,也可以是函数数组,或者两者结合使用.下面是相关的例子:
使用单个函数处理:
app.get('/example/a', function (req, res) { res.send('Hello from A!') })
使用多个函数处理(确保指定了'next'对象):
app.get('/example/b', function (req, res, next) { console.log('response will be sent by the next function ...') next() }, function (req, res) { res.send('Hello from B!') })
使用函数数组处理:
var cb0 = function (req, res, next) { console.log('CB0') next() } var cb1 = function (req, res, next) { console.log('CB1') next() } var cb2 = function (req, res) { res.send('Hello from C!') } app.get('/example/c', [cb0, cb1, cb2])
使用函数数组和独立的函数组合处理:
var cb0 = function (req, res, next) { console.log('CB0') next() } var cb1 = function (req, res, next) { console.log('CB1') next() } app.get('/example/d', [cb0, cb1], function (req, res, next) { console.log('response will be sent by the next function ...') next() }, function (req, res) { res.send('Hello from D!') })
响应方法:
下表中响应对象(res)的方法,用于响应客户端的请求并结束请求响应周期.如果在路由处理函数中没有调用任何响应方法,那么客户端的请求将被挂起.
res.download() | 提示文件被下载 |
res.end() | 结束响应过程 |
res.json() | 发送JSON响应 |
res.jsonp() | 发送支持JSONP的JSON响应 |
res.redirect() | 重定向请求 |
res.render() | 渲染视图模板 |
res.send() | 发送各种类型的响应 |
res.sendFile() | 将指定文件作为字节流响应 |
res.sendStatus() |
设置响应状态码,并发送其字符串表示为响应体。 |
app.route()
可以用app.route()创建链式路由处理。由于路径在一个位置指定,它有助于创建模块化路线,减少冗余和错别字。有关路由的详细信息,请参阅路由文档。
下面是使用app.route()定义的链式路由处理的例子:
app.route('/book') .get(function(req, res) { res.send('Get a random book'); }) .post(function(req, res) { res.send('Add a book'); }) .put(function(req, res) { res.send('Update the book'); })
express.Router
express.Router类可用于创建模块化可安装的路由处理程序。一个Router实例是一个完整的中间件和路由系统;因为这个原因,它通常被称为“小应用程序”。
下面的示例演示创建一个路由模块,并加载中间件,定义路径,并将它安装在主应用的一个路径上。
在应用文件夹中创建一个birds.js的文件,并添加如下内容:
var express = require('express'); var router = express.Router(); // middleware specific to this router router.use(function timeLog(req, res, next) { console.log('Time: ', Date.now()); next(); }) // define the home page route router.get('/', function(req, res) { res.send('Birds home page'); }) // define the about route router.get('/about', function(req, res) { res.send('About birds'); }) module.exports = router;
然后在应用中加载这个路由模块:
var birds = require('./birds'); ... app.use('/birds', birds);
现在该应用将能够处理"/birds"和"/birds/about"路径上的请求,以及调用特别为路由配置的中间件timeLog。
以上内容翻译自Express官网文档,原文参考Express Routing
相关推荐
首先,路由在Express中扮演着导航者的角色,它定义了服务器如何响应特定的HTTP请求方法(如GET、POST等)和URL路径。模块化路由则是将这些路由逻辑分解到单独的模块中,以提高代码的可读性和可维护性。这种方式有助...
2. **Express应用结构**:路由配置、中间件机制、视图系统(如ejs模板引擎)的应用。 3. **HTTP协议**:理解GET和POST请求的区别,以及如何通过Express处理这些请求。 4. **数据库操作**:可能包括连接数据库、CRUD...
例如,Express.js是Node.js中常用的后端路由库。 - 在服务器端,路由可以进行身份验证、权限检查,甚至返回静态资源或执行数据库查询。 4. **导航栏**: - 导航栏是Web应用的常见元素,显示可用的页面链接,帮助...
Vue Router是官方的路由管理器,用于处理页面导航和状态,与Vue2.x配合使用,实现单页应用(SPA)的路由。 **VueRouter2.x**: Vue Router是Vue.js的官方路由库,它允许我们定义路由规则,根据URL的变化动态渲染...
例如,你可以创建一个新的Express应用,定义路由,编写Coffeescript代码来处理这些路由的请求。Coffeescript的简洁语法可以使得代码更加清晰,而Express的灵活性则让你能够快速地搭建功能丰富的Web应用。 这个...
接着,你可以分析并理解项目结构,了解Express路由的配置、数据库模型的设计以及EJS模板的使用方法。同时,你还可以研究如何结合jQuery和Bootstrap来优化前端用户体验。最后,通过运行项目,你可以看到一个完整的...
路由是控制应用程序导航和页面间交互的关键机制。当我们谈论“路由跳转”,我们通常指的是用户点击链接、表单提交或者程序逻辑触发时,如何在不同的页面或应用状态之间平滑地过渡。 在给定的文件“路由跳转.zip”中...
在博客系统中,Bootstrap可以用来设计美观的用户界面,包括导航栏、文章列表、评论区等,确保在不同设备上都能良好显示。 MongoDB是一个文档型数据库,使用JSON格式的文档存储数据,非常适合处理结构灵活的数据。在...
Vue Router用于管理应用的路由,实现页面间的导航。Vuex则作为状态管理工具,集中管理全局状态,确保组件间状态的一致性。 2. Express:Express是Node.js平台上的一个web应用框架,它简化了服务器端的HTTP路由、...
Express路由适合多页面应用,涉及实际的页面跳转。 2. 动态更新:Angular路由在前端更新内容,无需完整页面刷新;Express路由在后端生成内容,通过HTTP响应传递到客户端。 3. 控制权:Angular路由由客户端控制,用户...
- server目录:存放Express应用代码,包括路由、模型、中间件等。 - client目录:存放Vue项目,包括组件、路由、样式、脚本等。 - database配置:数据库连接配置文件,如MongoDB或MySQL。 - 其他配置文件:如.env...
在“demo_01”中,我们可以看到项目的具体组织结构,可能包括`client`(React前端代码)、`server`(Express后端代码)、`models`(Mongoose数据模型)、`routes`(Express路由配置)、`public`(静态资源目录)等...
8. 路由管理:Vue Router在前端负责页面跳转和导航,而Express的路由定义则处理后端的HTTP请求,两者共同实现系统的导航和页面逻辑。 9. 错误处理:为了提高系统的健壮性,项目可能包含错误处理机制,如Express的...
9. **前端路由(vue-router)**:Vue-router是Vue.js官方的路由管理器,用于实现页面的动态路由和导航,帮助用户在不同的视图之间切换。 10. **响应式布局**:考虑到不同设备的兼容性,前端设计很可能采用了响应式...
开发者可以使用Express的路由和中间件来实现这些功能,同时配合MySQL进行数据操作。可以创建一个管理界面,允许管理员进行新闻管理操作。 9. **API设计**:项目可能包含前后端交互的API设计,如GET请求获取新闻列表...
8. **前端路由**:Angular4的`RouterModule`允许在应用内部导航,可能有如`/chat`的路由,引导用户进入聊天页面。 9. **状态管理**:为了处理复杂的应用状态,可能会使用如ngrx/store这样的状态管理库,来存储和...
在前端开发中,路由主要用于管理SPA的导航和页面间跳转,常见于React、Vue.js、Angular等现代JavaScript框架中。例如,在React中,`react-router-dom`库允许开发者定义URL模式与组件的映射,当用户改变URL时,相应的...
vue-router是Vue的官方路由管理库,它帮助我们管理页面间的导航和状态。在电商系统中,它可以轻松地处理商品详情页、购物车、订单管理等各种页面间的跳转。 Vuex是Vue的状态管理库,它集中管理全局状态,使得状态在...
商店库存应用课程中的一个项目,创建一个小型库存应用程序以练习在Express中执行CRUD操作我学到的东西Express路由/设置的更多实践快速验证程序的更多实践要做的事情添加身份验证/授权自己检查一下下载/克隆存储库,...
1. **快速启动**:使用 Express-Bootstrap 模板,开发者可以立即开始编写业务逻辑,因为基础结构已经准备就绪,包括设置静态文件路由、视图引擎配置和基本路由。 2. **响应式设计**:模板集成 Bootstrap,确保应用在...