深入浅析node.js中的express路由

本篇文章带大家了解一下node中的express路由,介绍一下基本使用方法,希望对大家有所帮助!

深入浅析node.js中的express路由

1. 路由的概念

1.1 什么是路由

广义上来讲,路由就是映射关系

现实生活中

1.png

按键 1  ->  业务查询按键 2  ->  手机充值按键 3  ->  业务办理按键 4  ->  密码服务与停复机按键 5  ->  家庭宽带按键 6  ->  话费流量按键 8  ->  集团业务按键 0  ->  人工服务在这里,路由是按键与服务之间的映射关系

1.2 nodejs中的路由

nodejs中的路由其实就是url地址和响应函数之间的映射关系,一个url地址响应一个html页面。

就是将一个路径匹配关系的业务提取到一个单独的js文件当中.

2. Express

2.1 Express 简介

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

express 官网(http://expressjs.com/)express 中文网(http://expressjs.com.cn/)

1. Express 的作用和 Node.js 内置的 http 模块类似,是专门用来创建 Web 服务器的。
2. Express 的本质:就是一个 npm 上的第三方包,提供了快速创建 Web 服务器的便捷方法。

进一步了解express

思考:不使用 Express 能否创建 Web 服务器?
答案:能,使用 Node.js 提供的原生 http 模块即可。

思考:既生瑜何生亮(有了 http 内置模块,为什么还有用 Express)?
答案:http 内置模块用起来很复杂,开发效率低;Express 是基于内置的 http 模块进一步封装出来的,能够极大的提高开发效率。

思考:http 内置模块与 Express 是什么关系?
答案:类似于浏览器中 Web API 和 jQuery 的关系。后者是基于前者进一步封装出来的。

2.2 基本使用步骤

安装:npm i express

// 导入 expressvar express = require('express');// 创建 express实例,也就是创建 express服务器var app = express();// 启动服务器app.listen(3000, function () {  console.log('服务器已启动')})

监听get请求

通过 app.get() 方法,可以监听客户端的 GET 请求,具体的语法格式如下:

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-wu5WkyIV-1639963661922)(images3/image-20200529231606651.png)]

监听post请求

通过 app.post() 方法,可以监听客户端的 POST 请求,具体的语法格式如下:

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-wzB8FFER-1639963661923)(images3/image-20200529231710830.png)]

响应内容给客户端

通过 res.send() 方法,可以把处理好的内容,发送给客户端:

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Iiifw7XV-1639963661924)(images3/image-20200529231837638.png)]

2.3 req属性详解

获取get请求的参数

通过 req.query 对象,可以获取到客户端通过GET方式,发送到服务器的参数:

比如:http://127.0.0.1:3000/index?id=10&name=tom&age=20

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-WUoF7b2h-1639963661925)(images3/image-20200529231928577.png)]

名称 作用

req.query获取Get请求传递过来的参数,拿到的是一个对象req.body获取Post请求传递过来的数据,拿到的是一个对象,需要注册一个中间件req.params获取Get请求中的路由参数,获取的是一个对象
例:jd.com/32342545365
app.get(‘/product/:id’)req.get(key)获取请示头中指定Key对应的Value

获取post请求的参数

通过req.body可以获取post请求的参数,但是需要配合body-parser中间件

不再需要使用req.on(‘data’,chunk=>{})         req.on(‘end’,()=>{})

如果没有这个中间件的话,则默认获取的是undefined.

// 最新的express版本,不再需要body-parse的下载支持了,直接按如下的方式来书写即可 app.use(express.urlencoded({ extended: true }))app.post('/index',(req,res)=>{  console.log(req.body);})

2.4 res属性详解

// send() 发送数据给客户端,并自动设置Content-Typeres.send()  //用于向浏览器客户端响应数据 会自带合适的响应头// 发送文件给浏览器,并根据文件后缀名自动设置Content-Type// 注意:文件路径必须是绝对路径res.sendFile(path.join(__dirname, 'index.html'))// 设置响应头res.set('Content-Type', 'text/plain')res.set({  'Content-Type': 'text/plain',  'cute': 'fangfang'})// 重定向 res.redirect('/index')
方法 作用

res.send()响应给客户端浏览器的数据,会自带响应头
send方法在将上面的对象数据响应给浏览器的时候,相当于内部会调用 JSON.stringify()res.sendFile(path)响应给浏览器一个页面res.redirect()重定向 会自带状态码res.set(key,value)自定义响应头res.status()设置响应状态码

2.5 express路由处理

基本使用

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-D3rId34r-1639963661925)(images3/image-20200529233016669.png)]

app.get(path, callback)app.post(path, callback)app.use(path, callback) 更重要的作用是处理中间件注意:只要是以path开头的请求地址,都可以被use处理注意:可以处理任意的请求类型注意:path参数可省略,默认值为:/

// all可以匹配任何提交方式 get和post都可以app.all('*',(req,res)=>{ // 做一个其它比较友好界面 响应给浏览器  res.send('页面还没完成,请等待...')})

路由的匹配过程

每当一个请求到达服务器之后,需要先经过路由的匹配,只有匹配成功之后,才会调用对应的处理函数。

在匹配时,会按照路由的顺序进行匹配,如果请求类型和请求的 URL 同时匹配成功,则 Express 会将这次请求,转交给对应的 function 函数进行处理。

2.png

路由匹配的注意点:

①按照定义的先后顺序进行匹配

②请求类型和请求的URL同时匹配成功,才会调用对应的处理函数

全局挂载路由

在 Express 中使用路由最简单的方式,就是把路由挂载到 app 上,示例代码如下

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-pdjsILgz-1639963661927)(images3/image-20200529233254606.png)]

2.6 模块化路由

       为了方便对路由进行模块化的管理,Express 不建议将路由直接挂载到 app 上,而是推荐将路由抽离为单独的模块。

将路由抽离为单独模块的步骤如下:

①创建路由模块对应的 .js 文件 router.js

②调用 express.Router() 函数创建路由对象

③向路由对象上挂载具体的路由

④使用 module.exports 向外共享路由对象

⑤使用 app.use() 函数注册路由模块

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-3fEDx0H3-1639963661928)(images3/image-20200529233324503.png)]

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-QAUKjV4x-1639963661931)(images3/image-20200529233330060.png)]

析稿Ai写作 析稿Ai写作

科研人的高效工具:AI论文自动生成,十分钟万字,无限大纲规划写作思路。

析稿Ai写作 97 查看详情 析稿Ai写作

2.7 静态资源处理

基本使用

express 提供了一个非常好用的函数,叫做 express.static(),通过它,我们可以非常方便地创建一个静态资源服务器,例如,通过如下代码就可以将 public 目录下的图片CSS 文件、**JavaScript **文件对外开放访问了:

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-C1BTBqzr-1639963661933)(images3/image-20200529232407154.png)]

现在,你就可以访问 public 目录中的所有文件了:http://localhost:3000/images/bg.jpghttp://localhost:3000/css/style.csshttp://localhost:3000/js/login.js注意:Express 在指定的静态目录中查找文件,并对外提供资源的访问路径。因此,存放静态文件的目录名不会出现在 URL 中。

托管多个资源目录

如果要托管多个静态资源目录,请多次调用 express.static() 函数:

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Px6ZUuaQ-1639963661934)(images3/image-20200529232555610.png)]

上面的设置需要注意的是:在html页面中的那些静态资源路径一定不要在出现public

访问静态资源文件时,express.static() 函数会根据目录的添加顺序查找所需的文件。

挂载路径前缀

如果希望在托管的静态资源访问路径之前,挂载路径前缀,则可以使用如下的方式:

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-e13liOYs-1639963661934)(images3/image-20200529232626696.png)]

现在,你就可以通过带有 /public 前缀地址来访问 public 目录中的文件了:http://localhost:3000/public/images/kitten.jpghttp://localhost:3000/public/css/style.csshttp://localhost:3000/public/js/app.js

2.8 express中间件

什么是中间件

中间件(Middleware )其实就是一个函数,特指业务流程的中间处理环节。

分为全局中间件和路由中间件。

中间件分为两种 一个是全局中间件 一个是路由中间件

现实生活中的例子

3.png

处理污水的这中间处理环节,就可以叫做中间件。

express中的中间件

当一个请求到达 Express 的服务器之后,可以连续调用多个中间件,从而对这次请求进行预处理。

4.png

基本使用

Express 的中间件,本质上就是一个 function 处理函数,Express 中间件的格式如下:

const mw = function(req, res, next) {  next()}app.use(mw)

注意:中间件函数的形参列表中,必须包含 next 参数。而路由处理函数中只包含 req 和 res。

next函数的作用: next 函数是实现多个中间件连续调用的关键,它表示把流转关系转交给下一个中间件或路由。

5.png

中间件的作用

多个中间件之间,共享同一份 req res。基于这样的特性,我们可以在上游的中间件中,统一为 req 或 res 对象添加自定义的属性或方法,供下游的中间件或路由进行使用。

6.png

定义多个中间件

可以使用 app.use() 连续定义多个全局中间件。客户端请求到达服务器之后,会按照中间件定义的先后顺序依次进行调用,示例代码如下:

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-s5pYXD4F-1639963661937)(images3/image-20200529233901695.png)]

express内置中间件

自 Express 4.16.0 版本开始,Express 内置了 3 个常用的中间件,极大的提高了 Express 项目的开发效率和体验:

① express.static 快速托管静态资源的内置中间件,例如: HTML 文件、图片、CSS 样式等(无兼容性)

② express.json 解析 JSON 格式的请求体数据(有兼容性,仅在 4.16.0+ 版本中可用)

③ express.urlencoded 解析 URL-encoded 格式的请求体数据(有兼容性,仅在 4.16.0+ 版本中可用)

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-WJaSINca-1639963661937)(images3/image-20200529234155137.png)]

3.EJS模板

3.1 ejs介绍

ejs是一个高效的javascript模板引擎,是为了使用户页面与业务数据(分离)而产生的。

简单来说,使用ejs模板引擎就可以帮助我们快速的将数据渲染到页面对应的位置,和art-template模板类似.

3.2 ejs的使用

1.下载

npm i ejs

2.配置模板引擎

app.set('view engine','ejs')

3.配置模板的存放目录

app.set('views','./views')   //默认的是可以省略

4.在views目录下创建模板文件    views文件夹中的静态页面此时应该修改后缀.ejs

5.使用模板渲染数据

res.render('index',obj)//第一个参数就是要渲染的页面,直接写名称不用加后缀//第二个参数表示待渲染的对象,通常是一个对象

3.3 数据渲染

     写业务逻辑

   在某位置输出数据

    不转义输出

更多node相关知识,请访问:nodejs 教程!!

以上就是深入浅析node.js中的express路由的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/553570.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
真·量子速读:突破GPT-4一次只能理解50页文本限制,新研究扩展到百万token
上一篇 2025年11月9日 21:14:57
java框架在云原生项目中的开发优势
下一篇 2025年11月9日 21:15:00

相关推荐

  • 构建VSCode多媒体编程界面与实时音视频处理

    答案:VSCode通过配置Node.js、Python扩展及FFmpeg等工具,结合OpenCV、PyAudio等框架,可构建高效音视频处理环境。1. 安装Python和Node.js支持,启用Pylance、Jupyter插件提升数据处理体验;2. 配置终端与Code Runner实现脚本一键执行…

    2026年9月22日
    100
  • rm -rf 误删文件?别急,或许有救!

    rm -rf 误删文件?别急,或许有救!rm -rf 误删文件?别急,或许有救!rm -rf 误删文件?别急,或许有救!rm -rf 误删文件?别急,或许有救!

    立即采取行动! 在生产环境中,我们应尽量避免进行风险操作。但如果不慎犯错,如何挽救呢?让我分享一个故事:上周我为了打包一个应用,需要整理Ubuntu 16.04上的线上数据,不小心删除了一个数据文件,幸而最终有惊无险,现记录如下。 extundelete 我的恢复计划主要依赖于一个工具——extun…

    2026年9月22日 用户投稿
    000
  • Linux系统中文件属性和权限实战操作

    Linux系统中文件属性和权限实战操作Linux系统中文件属性和权限实战操作Linux系统中文件属性和权限实战操作Linux系统中文件属性和权限实战操作

    —–原本今天的文章是昨天晚上就要更新的,但是由于昨天晚上下班回到住的地方,发现停电了,所以就没写成。今天是在上一篇文章–linux系统中文件类型的基础上,继续进行深入的学习。好了,直接开干。 一、文件的操作权限: 1、在这之前我想还是很有必要介绍对文件的操作权限(…

    2026年9月22日 用户投稿
    300
  • 使用本地HTML文件运行JavaScript脚本失败的原因及解决方案

    本文旨在帮助开发者理解在没有Web服务器的情况下,直接通过浏览器打开本地HTML文件时,JavaScript脚本可能无法正常运行的原因,并提供相应的解决方案。文章将深入探讨浏览器安全策略、相对路径问题以及如何正确引入和执行JavaScript脚本,确保你的HTML、CSS和JavaScript代码能…

    2026年9月21日
    100
  • PHPComposer怎么安装_PHPComposer依赖管理工具安装与使用指南

    PHPComposer是PHP的依赖管理工具,类似npm或pip。需先安装PHP,再下载并验证composer-setup.php,执行安装生成composer.phar,推荐全局安装至/usr/local/bin/composer,运行composer –version验证。使用com…

    2026年9月21日
    100
  • mysql如何实现后台管理系统

    答案:基于MySQL的%ignore_a_1%需设计用户、权限、日志等表结构,通过后端语言实现安全的CRUD接口与JWT认证,前端展示数据并控制权限,确保系统安全稳定。 实现一个基于 MySQL 的后台管理系统,核心是构建一个安全、稳定、可扩展的系统架构,将数据库作为数据存储层,配合后端语言和前端界…

    2026年9月21日
    200
  • VSCode的扩展推荐是怎么工作的?

    VSCode的扩展推荐基于用户行为和项目环境智能生成,当你打开.py文件时会推荐Python相关工具,打开.ts、.vue等文件则触发对应语言插件;系统通过分析package.json、requirements.txt等依赖文件识别技术栈,推荐Docker、ESLint等匹配扩展;同时记录常用操作如…

    2026年9月20日
    000
  • VSCode的侧边栏图标代表什么?

    资源管理器(文件夹图标)用于管理项目文件结构,支持新建、重命名、删除和拖拽操作;2. 搜索(放大镜图标)实现全局文本查找与替换,支持正则表达式及范围筛选;3. 源代码管理(分支图标)集成Git功能,可查看变更、提交代码并同步远程仓库;4. 运行和调试(虫子图标)支持断点调试、变量监控及多语言启动配置…

    2026年9月20日
    000
  • 如何为VSCode添加自定义主题?

    可通过安装扩展、手动添加JSON文件或使用Yeoman生成器创建主题。首先安装现成主题扩展并从颜色主题列表中选择应用;其次将自定义主题JSON文件放入用户themes目录后在命令面板中启用;最后可用yo code生成项目开发发布主题,需编辑配色文件并预览效果。 为 VSCode 添加自定义主题有几种…

    2026年9月20日
    000
  • edge浏览器无法打开本地HTML文件或显示空白怎么办_Edge浏览器打开本地HTML文件失败解决方法

    1、检查文件路径并选择Edge打开,确保路径为纯英文;2、在edge://flags中启用“Allow file access from files”;3、使用开发者工具排查资源加载错误;4、通过命令行启动Edge绕过安全限制;5、推荐使用npx live-server搭建本地服务器运行HTML文件…

    2026年9月20日
    000
  • VSCode的扩展推荐是基于什么?

    答案是VSCode根据文件类型、项目配置、用户行为和社区流行度智能推荐扩展。打开.py文件时提示Python扩展,存在package.json则推荐JS工具,频繁格式化代码会推荐Prettier,安装ESLint后可能推荐Prettier,高评分和官方扩展优先展示。 VSCode的扩展推荐主要基于你…

    2026年9月20日
    000
  • mysql如何实现用户注册功能

    答案:通过MySQL创建用户表并结合后端逻辑实现注册功能。首先在MySQL中创建包含用户名、密码、邮箱等字段的users表,确保唯一性约束;后端接收%ignore_a_1%提交的注册数据,对密码加密(如SHA256或bcrypt),使用参数化查询将数据安全存入数据库;前端通过表单或AJAX发送注册请…

    2026年9月13日
    200
  • 如何利用VSCode的配置文件(Launch.json)环境变量来管理不同环境的配置?

    通过配置launch.json中的多个调试环境并结合.env文件,可高效管理开发、测试、生产等不同环境的运行参数。 在使用 VSCode 进行开发时,launch.json 文件是调试配置的核心。通过合理利用环境变量和配置文件分离,可以轻松管理不同环境(如开发、测试、生产)的运行参数。 理解 lau…

    2026年9月13日
    000
  • 如何用ChatGPT来重构优化一段旧代码_提升代码质量与性能的步骤

    明确目标并提供上下文,分步引导ChatGPT优化代码结构、算法和语言特性,最后验证建议并本地测试,确保重构有效且安全。 ☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 免费无限量使用 DeepSeek R1 模型☜☜☜ 用ChatGPT来重构和优化旧代码是一种高效提升代码质量与性能的方式。关键…

    2026年9月12日
    200
  • 如何让VSCode自动识别项目类型?

    VSCode通过项目中的文件和配置自动识别类型,需提供线索如package.json、requirements.txt等标志性文件,结合安装对应语言扩展、配置.vscode/settings.json及使用.code-workspace文件,即可让编辑器正确识别并支持Node.js、Python、R…

    2026年9月12日
    300
  • 如何配置VSCode以附加(Attach)模式调试一个正在运行的Node.js或Python进程?

    要使用VSCode附加模式调试Node.js或Python进程,需先以可调试方式启动程序。对于Node.js,通过–inspect系列参数开启调试端口(如9229),并在launch.json中配置”request”: “attach”及对…

    2026年9月12日
    100
  • 如何找到并安装适合你编程语言的扩展?

    首先确认编程语言及项目需求,再根据编辑器选择合适扩展。以VS Code为例,通过扩展面板搜索语言名称,优先选择官方推荐、高下载量和评分的扩展,如Microsoft提供的Python扩展。安装后检查语法高亮与智能提示,并在设置中配置解释器路径、格式化工具等选项。若使用框架或特定运行时,可额外安装对应增…

    2026年9月12日
    200
  • 如何通过扩展让VSCode支持一门新的编程语言?

    要让VSCode支持新编程语言需通过扩展实现。1. 使用yo code生成扩展模板,包含package.json、语法高亮和语言配置文件。2. 在.tmLanguage.json中用正则定义语法高亮规则,注册到package.json。3. 通过language-configuration.json…

    2026年9月12日
    100
  • 除了内置的终端,VSCode有哪些插件能极大提升命令行的工作效率?

    Code Runner可一键运行多语言代码并显示结果,适合快速测试;2. Terminal Tabs通过标签页管理多个终端会话,支持重命名和快捷切换;3. Shell Command允许对文件或选中文本执行自定义shell命令,提升重复操作效率;4. Task Explorer可视化运行项目脚本,自…

    2026年9月12日
    100
  • 全栈应用中X-Frame-Options防护策略的正确实施

    本教程探讨了在全栈应用中配置`x-frame-options` http响应头以防止点击劫持(clickjacking)的常见误区。我们发现,在spring security等后端框架中配置此头部仅对后端api端点有效,而前端应用(如由nginx、tomcat等服务器托管的单页应用)仍可能面临风险。…

    2026年9月12日
    000

发表回复

登录后才能评论
关注微信