Node.js 中如何使用 Express 框架构建 Web 应用

阅读时长 6 分钟读完

Web 应用的开发是前端开发领域中十分重要的一部分。随着 Node.js 的出现,前端开发者可以用 JS 同时开发服务器端和客户端应用程序。

在 Node.js 中,Express 框架是最流行的 Web 应用开发框架之一,它可以帮助我们构建稳定、高效的 Web 应用程序。在本文中,我们将深入探讨 Express 框架的基本概念、核心组件和使用方法,为大家提供实践指导。

Express 框架概述

Express 框架是一个 web 应用程序开发框架,它简化了 Node.js 应用程序的开发过程。使用 Express,开发者可以轻松地构建和维护 web 应用程序。

Express 提供了许多内置的中间件函数,可以让我们快速地搭建一个简单的 Web 应用程序。例如,我们可以使用 express.static 中间件函数来直接提供静态文件,例如 HTML、图片、样式表和 JavaScript 等资源。

快速开始

在开始使用 Express 构建 web 应用程序之前,我们需要先安装 Node.js,然后使用 npm 安装 Express。

接下来,我们创建一个新的 Node.js 应用程序,并在应用程序中引入 Express:

以上代码定义了一个名为 app 的 Express 应用程序。

我们可以定义一个路由来处理 HTTP GET 请求,并发送一个简单的 “Hello World” 响应:

在浏览器中访问 http://localhost:3000/,即可看到 “Hello World” 的响应输出。

Express 中的路由

在 Express 中,路由将 HTTP 请求与相应的处理逻辑进行了绑定。路由由一个 URL、HTTP 请求方法和一个或多个中间件函数组成。

要定义一个简单的路由,我们可以使用如下代码:

以上代码定义了一个对根路径的 HTTP GET 请求做出响应的路由。当用户访问 http://localhost:3000 时,应用程序将向客户端发送一个 “Hello World” 响应。

Express 中的中间件

Express 中的中间件是指在处理 HTTP 请求之前或之后执行的函数。中间件函数可以拥有访问请求和响应对象 reqres,以及 Express 中的路由处理函数 next。中间件函数可以执行一些操作,例如修改请求或响应对象,处理错误等。

在 Express 中,中间件函数可以通过 app.use() 方法添加到应用程序中。例如,可以使用 body-parser 中间件函数解析 HTTP POST 请求消息体。

以上代码使用了 body-parser 中间件,并将其添加到 Express 应用程序中。加载此中间件函数后,我们就可以使用 req.body 访问 POST 请求的消息体。

除了使用其他 npm 包提供的中间件之外,我们还可以编写自定义的中间件函数:

以上代码定义了一个自定义中间件函数,该函数在每个 HTTP 请求之前将当前时间打印到控制台中。

Express 中的模板引擎

在 Express 中,模板引擎是一种将数据和模板合并在一起创建 HTML 页面的工具。支持的模板引擎包括 EJS、Pug 和 Handlebars 等。

以下是使用 EJS 模板引擎的示例代码:

以上代码使用了 ejs 模板引擎,并设置 Express 应用程序的视图引擎为 ejs

在路由处理函数中,我们通过 res.render 方法来渲染 EJS 模板,并将数据传递给模板。在以上示例中,我们渲染了名为 index 的 EJS 模板,并将一个包含标题数据的对象传递给该视图。

总结

在本文中,我们介绍了 Express 框架的基本概念、核心组件和使用方法。通过本文的介绍,我们了解了如何使用 Express 构建稳定、高效的 Web 应用程序。在后续的 Node.js 开发中,我们可以运用这些知识来更好地开发 Web 应用程序。

示例代码:

-- -------------------- ---- -------
----- ------- - -------------------
----- --- - ----------

------------- -------- -------

---------------- ----- ---- ----- -
  -------------------- ------------
  -------
---

----------------------------------

---------------------------- --------- ----- ----

------------------------

------------ -------- ----- ---- -
  --------------- ---------
---

------------- -------- ----- ---- -
  ------------- - ---- ----------
---

---------------- -------- ----- ---- -
  ------------- - --- ------- -- --------
---

------------------- -------- ----- ---- -
  ------------- - ------ ------- -- --------
---

-------------------- -------- ----- ---- -
  ------------- - --- ------- -- ------- - ---------------
---

----------------- -------- ----- ---- -
  ------------------- - ------ ------ ----- ---
---

---------------- -------- -- -
  -------------------- --- --------- -- ---- --------
---

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/64abc3fb48841e9894798031

纠错
反馈