一文带你搞懂Node.js路由是什么

更新日期: 2026-04-15 阅读: 128 标签: 路由

路由到底是个啥

说简单点,路由就是决定服务器该怎么回应用户请求的东西。

举个例子,你访问 http://example.com 看到一个页面,访问 http://example.com/about 又看到另一个页面。服务器怎么知道该给你哪个?这就是路由干的事。

没有路由的话,不管你访问哪个网址,服务器都给你返回一模一样的内容。有了路由,服务器就能根据你访问的地址不同,给你不同的东西。


原生Node.js怎么做路由

市面上大多数项目都用Express框架做路由,因为写起来简单。但为了搞明白原理,我们先看看不用框架,光用Node.js自带功能怎么做。

先看一段最基础的服务器代码:

const http = require('http');

const server = http.createServer((request, response) => {
    response.writeHead(200, {'Content-type': 'text/html;charset=utf-8'});
    response.end('你好,这是我搭的第一个Node.js服务器');
});

server.listen(8000, '127.0.0.1', () => {
    console.log('服务器跑起来了,访问地址: http://127.0.0.1:8000');
});

这段代码的问题是,不管你访问什么地址,它都只返回同一句话。我们需要加上路由功能。


先看看用户访问的是什么地址

加上request.url就能拿到用户访问的路径:

const http = require('http');

const server = http.createServer((request, response) => {
    console.log(request.url);  // 打印出来看看
    // 其他代码...
});

你访问http://127.0.0.1:8000/abc,控制台就会打印出/abc。这就好办了,我们可以根据这个路径来返回不同的内容。


用if/else写一个简单的路由

const http = require('http');

const server = http.createServer((request, response) => {
    const pathName = request.url;
    const charset = {'Content-type': 'text/html;charset=utf-8'};
    
    if (pathName === '/' || pathName === '/overview') {
        response.writeHead(200, charset);
        response.end('这是主页');
    } else if (pathName === '/product') {
        response.writeHead(200, charset);
        response.end('这是产品页');
    } else {
        response.writeHead(404, charset);
        response.end('找不到这个页面');
    }
});

server.listen(8000, '127.0.0.1', () => {
    console.log('服务器跑起来了,访问地址: http://127.0.0.1:8000');
});

这样写就能根据不同的网址返回不同的页面了。要是用户访问的地址不在我们写的规则里,就返回404。


原生路由的几个毛病

上面这种写法只适合自己练手,真要拿到项目里用,会遇到不少麻烦:

  1. 处理参数很费劲。比如/user?id=123这种带问号的地址,你得自己写代码把id=123解析出来。

  2. 动态路径不好搞。像/user/123、/user/456这种,用户id在变化,你得用正则或者字符串切割,写起来很啰嗦。

  3. 代码越写越乱。路径多了以后,if/else会变得特别长,改一个地方要找半天。


实际开发怎么做

在实际工作中,大多数人直接用Express框架。用Express写路由简单多了:

const express = require('express');
const app = express();

app.get('/', (req, res) => {
    res.send('这是主页');
});

app.get('/product', (req, res) => {
    res.send('这是产品页');
});

app.get('/user/:id', (req, res) => {
    // 直接就能拿到id参数
    res.send(`用户id是: ${req.params.id}`);
});

app.listen(8000);

Express帮你把解析路径、拿参数、匹配动态路由这些脏活累活都干了,你只需要关心每个地址该返回什么。


总结

路由说白了就是网址和代码之间的对应关系。原生Node.js也能写,但只适合学习原理。真要干活,用Express省时省力,代码也更好维护。

如果你想深入学习,建议先搞明白原生写法,再用Express做几个小项目,路由这块就能吃得透透了。

本文内容仅供个人学习、研究或参考使用,不构成任何形式的决策建议、专业指导或法律依据。未经授权,禁止任何单位或个人以商业售卖、虚假宣传、侵权传播等非学习研究目的使用本文内容。如需分享或转载,请保留原文来源信息,不得篡改、删减内容或侵犯相关权益。感谢您的理解与支持!

链接: https://fly63.com/article/detial/13627

相关推荐

Vue路由实现页面跳转的两种方式(router-link和JS)

Vue.js 路由可以通过不同的 URL 访问不同的内容,实现多视图的单页 Web 应用:通过 <router-link> 实现;<router-link> 组件用于设置一个导航链接,切换不同 HTML 内容

vue动态路由_vue-router通过接口请求动态生成路由的实现

在后台管理系统中,一般都会采用权限管理。路由菜单数据都会保存到数据库中,在vue-router 2.2版本新增了一个router.addRoutes(routes)方法,即可用它来实现动态路由了

vue-router中$route与$router,path与name,params与query的区别梳理

$router : 是路由操作对象,只写对象,$route : 路由信息对象,只读对象,path 和 Name路由跳转方式,都可以用query传参;path路由跳转方式,params传参会被忽略,只能用name命名的方式跳转

vue路由history模式_如何去除vue项目中的#

在使用vue-cli搭建的环境中,浏览器上URL地址中是存在#的,这是由于vue-router 默认 hash 模式,不难发现#的出现真的很丑陋。官网给出了如何使用history模式mode: history

vue路由传参主要的3种方式

vue中路由传参主要的3种方式:query方式(push时使用path来匹配)、params模式(push时使用name来匹配)、location预声明参数模式(push使用path来匹配,但是它跟params模式不同)

vue动态加载路由_实现vue动态加载路由器设置

我们的通用的后台管理系统中,我们会根据权限的粗细不同,会对每个角色每个权限每个资源进行控制。同样的我们也需要实现一个这样的功能。 这篇文章我将主要讲vue端的实现,关于后台接口我就不会涉及,当我接触的时候我们的后台接口是springcloud实现。

vue中路由按需加载的几种方式

使用vue-cli构建项目后,我们会在Router文件夹下面的index.js里面引入相关的路由组件,webpack在打包的时候会把整个路由打包成一个js文件,如果页面一多,会导致这个文件非常大,加载缓慢

vue-router 中参数传递(params,query)

query和params的区别,query相当于get请求,在页面跳转的时候,可以在地址栏看到请求参数,然而params则相当于post请求,参数不会在地址栏中显示。

Node.js的路由

当服务端接收到HTTP请求时,可以通过onRequest() 获取到url, pathname,query,及paramParams参数;为了解析这些数据需要使用url和querystring模块

vue 动态添加路由

最近在研究权限的相关东西,自然动态加载路由信息少不了。接下来我就来专门记录下我研究的东西。先后端代码返回一个对象,用java写的,返回的是对象,不是字符,如果是字符前端注意转换成对象。

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!