外出就餐并了解 Express.js 的基础知识
如果你曾经去过餐厅,那么你就能理解 Express 的基础知识。但如果你刚刚开始构建你的第一个 Node.js 后端……你可能会遇到一些坎坷。
是的——如果你之前有 JavaScript 经验,学习 Node 肯定会更容易。但是,构建后端时面临的挑战与在前端使用 JavaScript 时面临的挑战完全不同。
我学习 Node 时,选择了一条艰难的道路。我一遍又一遍地学习电子书、阅读教程和观看视频,直到最终明白了自己为什么要这么做。
有一个更简单的方法。我将用餐厅的比喻来解释你的第一个 Express 应用的四个关键部分。Express.js是一个流行的代码组织框架,我强烈推荐给所有初学者。稍后我会进一步解释。
以下是我们将要介绍的四个关键部分:
- require 语句
- 中间件
- 路由
- App.listen()/ 启动服务器
在这个比喻中,你是一位餐馆老板,想聘请一位总经理——负责制定所有流程并管理餐馆,确保餐馆顺利运转,让顾客满意而归。
以下是接下来内容的预览:
最后,您将了解基本 Express 应用程序每个部分的功能。
步骤 1:聘请经理(要求声明)
在这个例子中,你是餐馆老板。你需要聘请一位专家来管理新餐馆的日常运营。你当然不是专家,也不能把这件事交给服务员和厨房去处理。
如果你想经营一家高效安全的餐厅,你需要有人来确保员工以最高效率工作。Express 就是新的经理。
第一部分非常简单。与其他 NPM 包一样,你需要使用 npm install 来安装 express 模块,然后使用require语句来加载该模块。
与许多其他 NPM 包不同,您还需要使用这一行:
const app = express();
这是因为你需要一个变量来保存你的新 Express 应用程序。Express 不是 Node 的默认部分。
第二步:在餐厅做出决策(中间件)
让我们回顾一下。在餐厅里,有哪些常见的惯例?我脑子里立刻闪过三个:
- 为新顾客安排座位
- 接受食物订单
- 用餐结束时出示账单
对于每一项操作,在执行之前,你都需要进行一系列检查
。例如,在安排顾客入座之前,你需要了解以下信息:
- 他们穿着衬衫和鞋子(还有裤子)吗?否则,他们不能就座。
- 如果他们想坐在酒吧,他们是否年满 21 岁(如果您在美国)?
这可不是海滩酒吧!同样,在你的代码中,你需要验证
请求是否符合某些条件才能继续。例如,如果
有人尝试登录你的网站:
- 他们有账户吗?
- 他们输入了正确的密码吗?
这就是中间件概念的由来。中间件功能允许您对任何传入请求采取行动并在发回响应之前对其进行修改。
在你的餐厅里,你需要一系列规则来决定是否应该安排新来的客人入座。假设一对夫妇走进你的餐厅,在给他们安排座位之前,你必须遵循一条规则:他们是否穿着衬衫和鞋子?
首先,从app.use()开始。这意味着这些只是一些需要应用于接下来路由的规则。它们不是 GET、POST、PUT 或 DELETE。
在第 4 行,你有一个带有参数 req、res 和 next 的匿名函数。就此代码块而言,你只是检查请求 (req) 是否包含 shirt 和 shoes。
最后你还需要使用 next() 函数,因为你在这里只是验证服装。稍后,在路线中,你将允许客人获得一张真正的桌子。
在第 5 行和第 6 行,检查他们是否有衬衫和鞋子。
在第 7-9 行中,只有两者同时存在时才可以继续。
上面的代码块缺少一个重要的东西:path。这是请求中包含的特定字符串。由于缺少路径,它会在每个请求中运行。
你能想象吗?顾客进店……点菜……结账……店员们得上下打量他们,确保他们没穿衣服!这简直就是个死循环。
因此,我们修改了上面示例中的第 4 行。现在,只有当用户沿着 '/table' 路由请求时,我们才会运行此代码。
完整解释:
步骤3:执行常见例程(路由)
我们继续讨论座位安排的例子。到目前为止,我们只知道如何验证某人是否应该就座。但我们实际上并不知道该如何引导他们到餐桌旁并让他们坐下。
这时就需要用到路由了。路由允许我们根据路径编写特定的操作脚本。可用的选项有 GET、POST、PUT 和 DELETE,但我们现在只关注 GET 和 POST。
在餐厅场景中,我们需要创建一个 GET 请求来选择特定的餐桌并安排客人入座。GET 请求不会修改或添加数据库数据,它们只是根据特定参数检索信息。
假设您需要创建一个程序来安排两人的座位。数字 2 来自客户请求。
好的,在我解释之前:是的,这只是在最后发送了一条消息。它实际上还没有找到具体的桌位供顾客就座。我需要在数组中搜索空桌,这需要更多背景故事……这超出了本教程的范围。
在第 12 行,我们定义了当客人通过 '/table'路由请求时查找餐桌的流程。与上面的中间件示例类似,我们提供了请求和响应参数。它还有一个参数,金额。在本例中,金额为 2。
实际上,第 12 行函数声明之后的所有内容从技术上来说都是中间件,因为它修改了用户请求。您将在最后的图表中看到。
在第 13 行,我们从请求对象的参数中获取聚会人数。由于请求来自用户,因此没有在任何地方声明该参数,而且我们也没有任何前端代码。因此,如果这是一个真实的应用程序,请求可能如下所示:
req = {
params: {
amount: 2;
}
}
在第 13 行中,我们的 party 变量访问请求中的params对象的amount属性。
最后在第 14 行,我们向客户发送回复:我们正在寻找合适大小的桌子。
这一下子就很多了。下图:
步骤 3.5:提高餐厅效率(路由器)
现在,您可以追踪从请求到响应的完整路径。但是,随着应用规模的扩大,您可能不想为每个路由单独编写规则。您会发现某些路由共享相同的规则,因此您需要找到一种方法,将一组规则应用于多个路由。
就座位而言,您可以选择让顾客坐在吧台或餐桌旁。这两种座位都有共同的规则,比如衬衫和鞋子,但坐在吧台上要求每位客人都年满21岁。
另外,在服务顾客方面,你需要使用略有不同的程序来提供开胃菜、主菜和正餐。但这三种方式也有很多共同之处。
这就是路由器的作用所在。路由器允许您对路由进行分组,以便您可以创建通用规则。
我们需要创建中间件来覆盖每种情况。目前我只讨论座位情况,因为它会覆盖上面的代码。
以下是完整的代码片段:
我将分别介绍每个部分。
在第 4 行,我们声明我们的路由器。
在第 6 行和第 14 行中,我们现在用 seatingRouter.use() 代替 app.use() 来表明这个中间件仅与 seatingRouter 路由相关。
最后,在第 21 行,我们添加了更多中间件,以表明每个 seatingRouter 路由都以“/seating”开头。因此,如果有人请求酒吧座位,完整路径将是“/seating/bar”。这可能感觉有点不合逻辑,因为您可能希望在第 4 行创建路由器时就定义好路径。这很正常!
图表形式如下:
并且,当您添加 GET 路由时,它会位于为路由器分配路由的最后一条语句之上。
第四步:开业(港口)
好的,最后一部分。到目前为止,您已经聘请了一位经理,明确了在接受客户请求之前要做什么,并确定了在收到特定客户请求后该如何处理。现在,您只需要确定所有这些操作发生的地点的地址。
您的服务器具有类似于餐厅本身地址的端口。** **由于您的服务器可以同时处理多种类型的餐厅(或服务器端脚本),因此您需要告诉它每个脚本应该在哪里运行。
在上面的例子中,端口是 3000,它位于你的计算机上。因此,如果你输入:
在您的浏览器中,并且您正在运行 Node 应用,服务器就会知道运行特定的脚本。在这种情况下,只要您输入 URL,就会在控制台中记录消息,并能够使用任何**路由**。如果餐厅本身就是您的整个应用,那么它现在就在地址 3000 处营业了。
文章来源:https://dev.to/kbk0125/going-out-to-eat-and-understanding-the-basics-of-expressjs-4d6n