Koa中的路由讲解

2023-11-28 00:26:09 浏览数 (1)

大家在学习Koa框架的时候都不可避免的会接触的路由这个东西,那对于我们初学者来说路由到底是什么呢?

今天我们来好好讲解一下什么是路由

首先我们来看一下路由是什么?

路由,它决定了不同的URL是如何被不同的执行的。

这句话什么意思?比如你请求了某个网站的用户列表的URL他就会去执行查询用户列表,并返回用户列表数据。如果你请求了特定用户的接口的URL,他就会查询特定用户,并返回给你特定用户的数据。

路由的本质是什么?

在Koa中,路由的本质就是一个中间件。

那我们为什么要用路由。

想回答这个问题,我们要从两个方面来考虑,

  • 第一个是如果没有路由会怎么样。
  • 第二个是路由存在的意义是什么。

如果没有路由会怎么样

我们先来看一下如果没有路由会发生什么。

首先,所有的请求都会做相同的事情。比如我请求了 get 新浪微博的用户列表接口,跟我请求的 get 新浪微博的特定的用户接口都会做相同的查询。这显然是不行的,我们期望它能够做的是不同的查询。如果没有路由,所有的请求也都会返回相同的值。

我们来设想一下,如果你请求淘宝,并且再请求一次百度,这两次请求都会给你返回相同的页面。这样是不是就比较乱套了。

下面我们来写一个程序,演示一下什么是路由。

  • 首先在本地先创建一个文件夹。
  • 在这个文件夹里面,我们启动CMD,打开命令行工具。
  • 在命令行工具里面先执行 npm init -y初始化项目。
  • package.JSON文件初始化好之后,我们再执行 cnpm i koa--save
  • Koa 模块安装成功后。我们用Visual Studio Code打开当前的文件。在当前文件下面,我们创建一个文件叫app.js。在app.js里面开始编写Koa2的代码。

<p align=center><img src="https://p6-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/01679278b8c3430bb5a96a4133297b4e~tplv-k3u1fbpfcp-watermark.image?" alt="image.png" /></p>

  • 我们先使用 Koa2创建一个简单的服务器应用。首先第一步先引入koa模块。
代码语言:javascript复制
cost koa = require('koa')

然后我们再使用实例化koa的方式得到一个服务器应用对象。

代码语言:javascript复制
const app = new koa()

当我们通过实例化操作得到一个koa对象,拿到一个 APP 对象,通过 APP.use我们就可以开启一个中间件了。这里面我们使用ctx当作形参写一个箭头函数,我们需要向客户端响应一句话就可以了。比如ctx.body='hello world'。然后再开启一个监听端口,比如我们要监听的是 3000 端口。这个代码写好之后,我们就完成了一个简单的服务器的应用。

代码语言:javascript复制
cost koa = require('koa')
const app = new koa()

app。use(ctx =>{
    ctx.body = 'hellp world'
 })
 
 app.listen(300)

然后我们使用 node 命令来开启服务,切换到控制台。在控制台我们使用 node app.js开启客服务,此时没有报错,光标一直在闪,证明这个服务已经开启了。

<p align=center><img src="https://p9-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/23b52d29bc5a4b9ba78d82398676956f~tplv-k3u1fbpfcp-watermark.image?" alt="image.png" /></p>

然后我们打开浏览器。打开浏览器之后,我们在浏览器上面输入 localhost:3000,可以看到此时返回了 hello world的这样一个字样。不管我此时访问什么样的路径,它都会返回 hello world。我们可以来试一下。比如localhost:3000/users 还是localhost:3000/hello,都是返回一个hello world 。即使是我有嵌套路由,它也是返回 hello world。无论你嵌套几层,它都会返回 hello 的。证明我们现在还没有用路由来对它进行管理。所以这样是乱套的。

<p align=center><img src="https://p1-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/ec0a0116e88047d38225e88bb0049d0b~tplv-k3u1fbpfcp-watermark.image?" alt="image.png" /></p>

<p align=center><img src="https://p6-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/a9e1ac04461a40c4ae62fa937f1daf9a~tplv-k3u1fbpfcp-watermark.image?" alt="image.png" /></p>

<p align=center><img src="https://p9-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/1f86c54ef75a4cf39f126bcce9f6d128~tplv-k3u1fbpfcp-watermark.image?" alt="image.png" /></p>

不管你是访问什么样的一个请求,它都会给你返回同一个内容。我们现在用的是get请求。我们按 F12 打开控制台,在浏览器的开发者工具,我们点network刷新。可以看见。这里面它发了两个请求,一个是要请求一个图标。我们看一下上面请求。此时用的是get请求。

<p align=center><img src="https://p1-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/0e226b725ae44043ae854b8c1f89f416~tplv-k3u1fbpfcp-watermark.image?" alt="image.png" /></p>

我们也可以去尝试使用post的请求。这里我们如果想要发送一个post的请求,就需要借助第三方的工具。我们可以使用的一个工具叫 postman,这个工具后面也会伴随我们整个的开发过程。我们用 Postman 可以去测试接口。打开Postman。我们可以在这里面去模拟get请求、post请求以及其他的HTTP请求。get请求我们已经尝试过了,下面我们可以尝试一下post的请求,我们请求的地址还是 http://localhost:3000

<p align=center><img src="https://p9-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/19f41133cac64facbabc65122752df84~tplv-k3u1fbpfcp-watermark.image?" alt="image.png" /></p>

点击发送,我们可以看到返回的还是 hello world 的字样。如果我们在这里面再加几个层级,发送请求,无论我们的路由请求几层,它返回的都是 hello world 。这里面也无论我们用什么样的请求方式,请求的结果还是一样的。我们可以换一个,比如用 put 请求,我们再换一个,比如 delete 请求。

可以看到我们现在没有使用路由来进行管理,此时不管你是请求什么样的路径,它都是乱套的。所以我们在整个项目开发过程中,路由是非常重要的。

路由的存在意义

通过刚刚的代码,我们可以看到路由它的存在意义。

  • 首先是处理不同的URL,我们要做什么事情,根据路由来决定。我们通过路由就找到了这个地方,去做相应的业务逻辑的处理好,这是它的第一个意义。
  • 第二点就是处理不同的HTTP方法,因为我们在请求一个地方的时候,可能你这个请求方式会有很多种,比如get请求、post 请求。每一种请求的方法,它的所代表的意义又不一样。所以我们为了区分不同的请求方法,我们也得去使用路由。
  • 最后一点就是为了解析URL上面的参数,因为我们在去做前后端分离开发,或者是服务端渲染。不管怎么样,只要是属于web应用,我们都需要通过http请求,并且请求一个地址,把我们要请求的参数传给服务器端,服务器端根据我们传的参数来决定我们要做什么事情,或者是服务器要给我们去怎么查询数据库返回什么样的结果。所以这一点也是比较重要的。

以上三点就说明了路由存在的意义,所以我们在项目开发的过程中,一定要去区分好路由,以及对路由要有一个合理的规划。

写在最后

伙伴们,如果你觉得我写的文章对你有帮助就给zayyo点一个赞

0 人点赞