目录

Express 框架:简介与使用指南

1.什么是 Express?

1.1. 安装 Express

1.2. 创建基本 Express 应用

2.Express 的主要功能

2.1路由(Routing)

2.1.1获取请求报文参数:

2.2.中间件(Middleware)

2.2.1全局中间件:

2.2.2路由中间件:

2.2.3静态资源中间件:

2.3 防盗链

2.3.1:什么是防盗链?

2.3.2实现防盗链中间件:

2.4模板引擎支持

2.4.1:什么是模板引擎?

2.4.2:模板引擎作用:

2.4.3:常用模板引擎:

2.4.4操作步骤安装模板引擎(以 EJS 为例):

 2.4.5 EJS 模板引擎使用

结语


Express 框架:简介与使用指南

Express 是一个基于 Node.js 的快速、简洁且灵活的 Web 应用程序框架。它为构建 Web 应用程序和 API 提供了强大的功能和便捷的工具。本文将介绍 Express 框架的基本概念及其在 Web 开发中的应用。


1.什么是 Express?

Express 是一个流行的 Node.js 框架,为开发者提供了简洁的 API,用于处理 HTTP 请求、响应,以及管理中间件、路由和错误处理。Express 简化了构建 RESTful API、Web 应用程序和微服务的过程。

1.1. 安装 Express

在开始使用 Express 之前,你需要安装它。在你的项目目录中,运行以下命令

npm install express 

1.2. 创建基本 Express 应用

创建一个 app.js 文件,编写以下代码:

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

// 定义路由
app.get('/', (req, res) => {
  res.send('Hello, World!');
});

// 启动服务器
app.listen(3000, () => {
  console.log('Server is running on port 3000');
});

运行 app.js 文件后,你将拥有一个在端口 3000 上运行的 Web 服务器。


2.Express 的主要功能


2.1路由(Routing)

路由是指定义应用程序端点(URI)及如何响应客户端请求的方法。在 Express 中,路由使用方法如 app.get(), app.post(), app.put(), 和 app.delete() 等,分别对应 HTTP 的请求方法。
路由的使用示例代码:

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

// GET 请求的路由
app.get('/', (req, res) => {
  res.send('Hello World!');
});

// POST 请求的路由
app.post('/login', (req, res) => {
  // 处理登录逻辑
});

app.listen(3000, () => {
  console.log('App listening on port 3000');
});

上述例子中当用户发送 GET 请求至根路径 '/' 时,服务器会响应 'Hello World!'。类似地,当用户发送 POST 请求至 '/login' 路径时,服务器会处理登录逻辑。


2.1.1获取请求报文参数:

在 Express 中,可以通过 req.params、req.query 和 req.body 来获取请求参数。示例代码如下:

// 路由参数
app.get('/user/:id', (req, res) => {
  const userId = req.params.id; // 获取路由参数
});

// 查询参数
app.get('/search', (req, res) => {
  const query = req.query.q; // 获取查询参数
});

// 请求体参数
app.post('/login', (req, res) => {
  const username = req.body.username; // 获取 POST 请求体参数
});

在上述例子中,req.params.id 用于获取路由参数,req.query.q 用于获取查询参数,req.body.username 用于获取 POST 请求体参数。


2.2.中间件(Middleware)

中间件是一种函数,它可以访问请求对象(req)、响应对象(res)和应用程序的中间件堆栈中的下一个中间件函数。

中间件函数通常用于执行以下任务:

1、执行任何代码。

2、对请求和响应对象进行更改。

3、结束请求-响应循环。

4、调用堆栈中的下一个中间件函数。


2.2.1全局中间件:

全局中间件在每个请求上都执行,可以用于日志记录、身份验证等任务。
 

// 全局中间件
app.use((req, res, next) => {
  console.log('Time:', Date.now());
  next();
});

在上面的例子中,app.use() 注册了一个全局中间件,它在每个请求上都会打印当前时间。


2.2.2路由中间件:

路由中间件仅与特定路由相关联,可以用于执行特定于该路由的任务。

// 路由中间件
const middlewareFunction = (req, res, next) => {
  // 执行特定于路由的任务
  next();
};

app.get('/route', middlewareFunction, (req, res) => {
  res.send('Route with middleware');
});

在上面的例子中,middlewareFunction 是一个路由中间件,它仅与 '/route' 路由相关联,用于执行特定于该路由的任务。


2.2.3静态资源中间件:

静态资源中间件用于提供静态文件,如 HTML、CSS、JavaScript 文件等。

// 静态资源中间件
app.use(express.static('public'));

在上述例子中,express.static() 中间件将 public 文件夹下的文件提供给客户端。

2.3 防盗链

2.3.1:什么是防盗链?

防盗链是一种防止他人通过直接访问 URL 来获取服务器资源的技术,通常用于防止未授权的访问。在 Express 中,可以通过检查请求头中的 `Referer` 字段来实现简单的防盗链功能。

2.3.2实现防盗链中间件:

   app.use((req, res, next) => {
     const origin = req.headers['referer'] || req.headers['referrer'];
     if (!origin || !origin.includes('yourwebsite.com')) {
       res.status(403).send('Forbidden');
     } else {
       next();
     }
   });
   const port = 3000;
   app.listen(port, () => {
     console.log(`Server running on port ${port}`);
   });

2.4模板引擎支持

2.4.1:什么是模板引擎?

模板引擎是一种将数据与预定义模板结合的工具,用于生成最终输出内容的软件组件。它将模板文件中的特殊标记或占位符与数据结合,生成最终的文本输出。这种模板与数据分离的方法使得在修改模板或数据时能够更轻松地管理和维护应用程序。

2.4.2:模板引擎作用:

  1. 分离逻辑与展示:模板引擎允许开发人员将应用程序的逻辑与展示分离开来。通过在模板中引用数据,而不是在代码中硬编码,可以更清晰地组织代码并降低维护成本。
  2. 提高可维护性:模板引擎使得更改页面布局或设计变得更加容易,因为修改模板文件不会影响到底层的业务逻辑。
  3. 增加可重用性:通过将模板定义为可重用的组件,可以在多个页面或应用程序中重复使用相同的模板片段,从而提高开发效率。
  4. 简化开发流程:模板引擎简化了前端开发流程,使得设计人员和开发人员能够更容易地协作,同时加速开发周期。

2.4.3:常用模板引擎:

  1. Jinja2:Jinja2 是一个基于 Python 的模板引擎,广泛用于 Web 开发。它具有简洁的语法和强大的功能,支持模板继承、条件语句、循环等功能。
  2. Handlebars.js:Handlebars.js 是一个 JavaScript 模板引擎,可以在客户端和服务器端使用。它使用简单的标记语法,易于学习和使用。
  3. Mustache:Mustache 是一个跨语言的模板引擎,支持多种编程语言。它的语法简单,易于理解,可以在多种环境中使用。
  4. EJS (Embedded JavaScript):EJS 是一个基于 JavaScript 的模板引擎,可以与 Node.js 搭配使用。它允许在模板中嵌入 JavaScript 代码,具有灵活的功能和性能。

Express 可以使用多种模板引擎来渲染视图。要使用模板引擎,首先需要安装相应的模板引擎库。

2.4.4操作步骤安装模板引擎(以 EJS 为例):

   npm install ejs

2. 配置 Express 使用 EJS:

 app.set('view engine', 'ejs');

 2.4.5 EJS 模板引擎使用

EJS 是一种流行的模板引擎,它允许你使用普通的 JavaScript 代码来生成 HTML 页面。

操作步骤创建 EJS 模板文件
   在 `views` 目录下创建一个名为 `index.ejs` 的文件,内容如下:

  <!DOCTYPE html>
   <html>
   <head>
     <title>EJS Example</title>
   </head>
   <body>
     <h1>Hello, <%= user.name %></h1>
     <p><%= message %></p >
   </body>
   </html>

结语

Express 框架是构建 Node.js Web 应用程序的理想选择。它提供了强大且易于使用的工具,可以满足各种不同类型的 Web 开发需求。本期到此结束,关注我,我会继续写的!!
 

Logo

欢迎加入西安开发者社区!我们致力于为西安地区的开发者提供学习、合作和成长的机会。参与我们的活动,与专家分享最新技术趋势,解决挑战,探索创新。加入我们,共同打造技术社区!

更多推荐