WEB开发: Node.js路由之由浅入深(一) - 全栈工程师入门

作为一个使用Node.js多年的开发者,我已经习惯于用Node.js写一些web应用来为工作服务,因为实现快速、部署简单、自定义强。今天我们一起来学习一个全栈工程师必备技能:web路由。(观看此文的前提是默认你已经装好nonde.js了)

Node.js 中的路由是构建 Web 应用的核心概念之一,帮助我们根据用户请求的 URL 和 HTTP 方法(GET、POST 等)做出不同的响应。

下面我们由浅入深,循序渐进地讲解 Node.js 的路由实现:


1. 什么是路由?

【路由(Routing)】是指确定服务器响应用户请求的方式,也就是你访问网站的哪个路径,服务器根据路径响应你相应的内容。

比如某网站 www.duniang.com/路由1 、 www.duniang.com/路由1/路由1的儿子

路由主要根据两个要素:

  • 请求的 URL(如 /home/about
  • 请求的方法(如 GETPOSTPUTDELETE
    关于这一点网上有很多讨论,很多人基本就是 GET /  POST 一招吃遍天下,这也无可厚非。不过建议开发者还是老老实实 规规矩矩的把习惯养好,该PUT就PUT 该DELETE就DELETE。

2. 用原生 Node.js 实现简单路由

用原生的 http 模块,我们可以通过检查请求的 URL 和方法来实现路由。以下是一个简单的例子:

const http = require('http');const server = http.createServer((req, res) => {const { url, method } = req;if (url === '/' && method === 'GET') {res.writeHead(200, { 'Content-Type': 'text/plain' });res.end('Welcome to Home Page');} else if (url === '/about' && method === 'GET') {res.writeHead(200, { 'Content-Type': 'text/plain' });res.end('This is the About Page');} else {res.writeHead(404, { 'Content-Type': 'text/plain' });res.end('Page Not Found');}
});server.listen(3000, () => {console.log('Server running at http://localhost:3000/');
});

特点:

  • 手动判断 urlmethod
  • 适合学习,但不适合复杂应用,代码难以维护。

http是node内核自带的网络服务模块,可以快速创建http服务。 

将上面代码命名为 app.js ,使用  node app.js 命令 启动

创建了一个端口为3000的 webServer,我我们可以通过 http://127.0.0.1:3000访问:


3. 使用 Express 简化路由

http 这个模块使用起来还是不太方便,观感不太好,代码量也比较大,如果路由复杂,要写很多代码。所以就有了 Express

Express 是一个轻量级、流行的 Node.js 框架,它对路由的处理非常直观。我们可以用它创建清晰、可扩展的路由。

安装 Express:

npm install express

简单路由示例:

const express = require('express');
const app = express();app.get('/', (req, res) => {res.send('Welcome to Home Page');
});app.get('/about', (req, res) => {res.send('This is the About Page');
});// 404 handler
app.use((req, res) => {res.status(404).send('Page Not Found');
});app.listen(3000, () => {console.log('Server running at http://localhost:3000/');
});

优点:

  • 简洁的 API,如 app.get()app.post()
  • 支持中间件,可以扩展功能(如验证、日志)。

上面这个代码就清楚多了。 Express在现实中的应用非常广泛,它简单、直观,使用起来也很灵活。


4. 动态路由

动态路由允许我们为具有相似结构的 URL 创建单一路由。例如,处理用户的 ID:

app.get('/user/:id', (req, res) => {const userId = req.params.id; // 获取动态参数res.send(`User ID is ${userId}`);
});

访问 http://localhost:3000/user/123,响应为:

User ID is 123

请注意,这里的网址是 /user/minstbe  后面这个/minstbe 本来应该是一个路由,但是这里被定义为一个参数 ,它等效于 /user?id=minstbe 。很多时候我们如果不希望网页带有问号、等于号,就可以用这种方式来定义传参。

req.params:存储动态 URL 参数。

 如果我们在服务器端 console.log(req.params)  就会看到打印出了这个Object类型的参数:


5. 路由模块化

当路由逻辑增多时,我们可以将路由分离到单独的文件中,提高代码的可读性和可维护性。实际生产过程中,还会用到更加高级的分离方式 这个我们以后再介绍。

1. 创建路由模块(routes/user.js):

在webServer的主目录下创建 文件夹 routes ,并创建user.js,用来对 /user做出响应 

const express = require('express');
const router = express.Router();router.get('/:id', (req, res) => {const userId = req.params.id;res.send(`User Profile of ID: ${userId}`);
});module.exports = router;

2. 在主文件中引入路由模块(index.js):

const express = require('express');
const app = express();
const userRoutes = require('./routes/user'); // 这里引入了这个路由模块app.use('/user', userRoutes); // 访问路径为 /user/:idapp.listen(3000, () => {console.log('Server running at http://localhost:3000/');
});

上面两个文件结合使用,启动index.js 后如下: 


6. 中间件与路由结合

中间件是在路由处理前或后执行的一段代码,用于实现日志、验证、解析等功能。

中间件在Node.js的webServer中非常重要,很多功能都是在中间件实现的,通过中间件处理获取到的内容,再交给后面的api来处理。 

示例:

const logger = (req, res, next) => {console.log(`${req.method} ${req.url}`);next(); // 必须调用 next() 才能进入下一个中间件或路由
};app.use(logger);app.get('/', (req, res) => {res.send('Home Page with Logger');
});

 下面是在/user 之前 加入了一个中间件,也就是显示 访问方式 和 路径,然后再继续 交给 /user判断处理:(请注意控制台的输出)


7. 高级路由功能

  1. 处理多种 HTTP 方法:
app.route('/book').get((req, res) => res.send('Get a book')).post((req, res) => res.send('Add a book')).put((req, res) => res.send('Update a book'));

app.route() 是 Express 提供的一个链式路由定义方法,用于处理针对 同一路径 的多个 HTTP 方法(如 GETPOSTPUT 等)的请求。

工作原理

app.route(path) 会创建一个单独的路由路径对象,可以通过链式调用分别为该路径定义不同的 HTTP 方法处理逻辑。这种写法能使代码更加清晰、结构更紧凑。


具体解析

app.route('/book').get((req, res) => res.send('Get a book')).post((req, res) => res.send('Add a book')).put((req, res) => res.send('Update a book'));
  1. app.route('/book')
    定义了一个路径 /book 的路由。

  2. .get()

    • 处理 GET /book 请求。
    • 回调函数 (req, res) 用于返回一个响应,当前返回内容是 'Get a book'
  3. .post()

    • 处理 POST /book 请求。
    • 回调函数 (req, res) 返回 'Add a book'
  4. .put()

    • 处理 PUT /book 请求。
    • 回调函数 (req, res) 返回 'Update a book'

等价写法

上述代码的功能可以用多个单独的路由来实现:

app.get('/book', (req, res) => res.send('Get a book'));
app.post('/book', (req, res) => res.send('Add a book'));
app.put('/book', (req, res) => res.send('Update a book'));

对比:

  • 使用 app.route() 方法:
    • 逻辑集中在一个地方,便于管理和阅读。
    • 适合路径相同但处理方法不同的场景。
  • 使用分开定义的路由:
    • 路径重复,代码冗长,不够直观。

扩展:何时使用 app.route()

  1. 当一个路径需要支持多种 HTTP 方法时,比如 /book 需要处理 GETPOSTPUT
  2. 希望减少路径的重复书写,提高代码可读性和组织性。

注意:

  • app.route() 仅适用于同一个路径。如果处理的路径不同(比如 /book/author),仍需单独定义路由。
  • 它仅是 Express 提供的一种语法糖,本质上和单独写多个路由的逻辑一样。
  1. 正则匹配路由:
app.get(/.*fly$/, (req, res) => {res.send('Route matched with /.*fly$/');
});
// 例如,访问 /butterfly、/dragonfly 都可以匹配

好了 今天,就简单介绍一下,下次再继续!

  1. 原生实现:适合理解底层原理。
  2. Express:简化路由逻辑,是构建 Web 应用的主流选择。
  3. 动态路由:为类似的请求模式处理提供便利。
  4. 模块化路由:适合复杂项目。
  5. 中间件支持:增强功能的可扩展性。

可以从简单的例子开始尝试,然后逐渐增加复杂度,适应实际的开发场景!你想尝试哪种实现?

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/485935.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【后端面试总结】Redis字符串实现原理

字符串是我们平时接触频率最高的一个基础类型,但就是这么一个平平无奇的基本类型,在Redis里面也是经历了各种各样的优化,来优化它对内存的占用,了解这部分内容,与其说是“学习Redis”,不如说是“向Redis学习…

GitToolBox插件:让IntelliJ IDEA的Git操作如虎添翼

GitToolBox插件介绍 GitToolBox是一款针对IntelliJ IDEA的插件,旨在增强IDE内置的Git功能,使Git操作更加便捷和高效。无论是单独开发者还是团队中的一员,这个插件都能帮助更好地管理代码和协作流程。 功能特点 分支管理:GitToolBo…

Vulhub:Shiro[漏洞复现]

目录 CVE-2010-3863(Shiro未授权) 使用浏览器访问靶场主页面 使用Yakit进行抓包 使用ffuf对靶机8080端口进行根路径FUZZ CVE-2016-4437(Shiro-550) 使用浏览器访问靶场主页面 使用Yakit进行抓包 使用Yakit反连中自带的Yso-Java Hack进行漏洞利用 首先运行脚本生成一个…

Netty 框架——TCP 粘包和拆包

Netty 框架——TCP 粘包和拆包 1. 产生的原因 在 TCP 协议中,发送端为了提高网络传输的效率,通常会使用优化算法,如 Nagle 算法,将多个小的数据包合并成一个较大的数据块一起发送。这是因为频繁的小数据包传输可能会导致效率低下…

SQL靶场第九关攻略

我们的第九关需要用到时间盲注 使用条件:完全没有变化的页面 我们在了解一下时间盲注和布尔盲注的区别,时间盲注比布尔盲注多了一个if判断加上sleep()函数的运用 if(a,b,c) if判断句,a为条件,b、c为执行语句;如果a为…

STM32一keil5更换芯片后报错问题的解决。

目录 一、STM32型号认识二、报错问题三、常用的启动配置文件四、问题解决 一、STM32型号认识 二、报错问题 当我们在原来工程下修改芯片时,原本可以编译通过的代码突然很多报错。如下所示,这是因为我们的启动文件配置错误。对于不同型号的芯片其flash容量…

STM32 自学笔记

摘抄于大学期间记录在QQ空间的一篇自学笔记,当前清理空间,本来想直接删除掉的,但是感觉有些舍不得,因此先搬移过来。 RAM vs ROM vs FLASH 2013-09-05记录,ROM和RAM指的都是半导体存储器,ROM是Read Only …

深入解析 HTML Input 元素:构建交互性表单的核心

🤍 前端开发工程师、技术日更博主、已过CET6 🍨 阿珊和她的猫_CSDN博客专家、23年度博客之星前端领域TOP1 🕠 牛客高级专题作者、打造专栏《前端面试必备》 、《2024面试高频手撕题》 🍚 蓝桥云课签约作者、上架课程《Vue.js 和 E…

MBox20边缘计算网关:氢能车间数据采集的智慧引擎

氢能作为未来能源体系的重要组成部分,其安全、高效、环保的特性备受瞩目。在氢能车间的日常运营中,数据采集是确保生产流程优化、设备稳定运行及能效提升的关键环节。然而,面对氢能车间复杂多变的生产环境和海量数据,如何实现高效…

敏捷开发之路

1. 引言 最近有个企业软件开发项目,用户要求采用敏捷开发的方法实施项目。以前也参加过敏捷方法的培训,结合最近找的敏捷开发材料,形成了下面的敏捷实施过程内容。 以下采用了QAD量化敏捷开发方法,关于此方法详细参考内容见最后…

threejs相机辅助对象cameraHelper

为指定相机创建一个辅助对象,显示这个相机的视锥。 想要在场景里面显示相机的视锥,需要创建两个相机。 举个例子,场景中有个相机A,想要显示相机A的视锥,那么需要一个相机B,把B放在A的后面,两个…

Milvus向量数据库03-搜索理论

Milvus向量数据库03-搜索理论 1-ANN搜索 通过 k-最近邻(kNN)搜索可以找到一个查询向量的 k 个最近向量。kNN 算法将查询向量与向量空间中的每个向量进行比较,直到出现 k 个完全匹配的结果。尽管 kNN 搜索可以确保准确性,但十分耗…

解决git did not exit cleanly (exit code 128)问题

解决 git did not exit cleanly (exit code 128)问题 1、错误描述2、解决方法2.1 方法一2.2 方法二 1、错误描述 使用TortoiseGit进行操作时,总是提示下述错误。 2、解决方法 2.1 方法一 打开 TortoiseGit -> Settings 点击 Network&…

唇形同步视频生成工具:Wav2Lip

一、模型介绍 今天介绍一个唇形同步的工具-Wav2Lip;Wav2Lip是一种用于生成唇形同步(lip-sync)视频的深度学习算法,它能够根据输入的音频流自动为给定的人脸视频添加准确的口型动作。 (Paper) Wav2Lip模型…

ubuntu下Qt5自动编译配置QtMqtt环境(10)

文章目录 [toc]1、概述2、下载QtMqtt源码3、编译4、验证5、参考6、视频 更多精彩内容👉内容导航 👈👉Qt网络编程 👈 1、概述 Qt默认是不包含mqtt库的,如果需要使用到mqtt库就只能自己编译配置; 网络所有的…

verilog编程规范

verilog编程规范 文章目录 verilog编程规范前言一、代码划分二、verilog编码ABCDEFG 前言 高内聚,低耦合,干净清爽的代码 一、代码划分 高内聚: 一个功能一个模块干净的接口提取公共的代码 低耦合: 模块之间低耦合尽量用少量…

使用VScode 和 Keil搭建STM32的开发环境

目录 概述 1 Keil工具 1.1 Keil工具介绍 1.2 Keil 下载 1.3 安装Keil 1.4 Keil软件测试 2 VSCode软件 2.1 VSCode介绍 2.2 VSCode下载 2.3 安装VSCode 3 搭建STM32集成开发环境 3.1 安装Keil插件 3.2 参数配置 3.3 测试 4 配置头文件路径 4.1 参数配置 4.2 测…

【C++学习篇】map和set (set篇)

目录 1.map和set的使用 1.1序列式容器和关联式容器 2. set系列的使⽤ 2.1 set分类 2.2set类的介绍 2.3 set的构造和迭代器 2.4set的增删查 2.5 insert和迭代器遍历使⽤样例: 2.6 find和erase使⽤样例: 2.7multiset和set的差异 1.map和set的…

WGAN生成对抗网络数据生成

数据生成 | WGAN生成对抗网络数据生成 目录 数据生成 | WGAN生成对抗网络数据生成生成效果基本描述程序设计参考资料 生成效果 基本描述 1.WGAN生成对抗网络,数据生成,样本生成程序,MATLAB程序; 2.适用于MATLAB 2020版及以上版本&…

简易图书管理系统

javawebjspservlet 实体类 package com.ghx.entity;/*** author :guo* date :Created in 2024/12/6 10:13* description:* modified By:* version:*/ public class Book {private int id;private String name;private double pri…