【利用AI让知识体系化】入门Express框架(二)

简介: 【利用AI让知识体系化】入门Express框架

【利用AI让知识体系化】入门Express框架(一)https://developer.aliyun.com/article/1426061


2. 路由模块化

当我们的应用程序变得比较大时,所有的路由定义可能会变得混乱和不易维护。因此,我们可以使用路由模块化来改善这种情况。

首先,在routes目录下创建一个专门用于存放路由的文件,例如users.js。接着,我们在users.js文件中定义路由,如下所示:

const express = require('express');
const router = express.Router();
router.get('/', function(req, res) {
    res.send('Get all users');
});
router.post('/', function(req, res) {
    res.send('Create a user');
});
module.exports = router;

在上面的例子中,我们定义了两个路由,一个是GET方法的路由"/“,另一个是POST方法的路由”/",最后使用module.exports导出路由模块。

接着,在应用程序中,我们可以使用app.use()来向Express应用程序注册该路由模块,如下所示:

const usersRouter = require('./routes/users');
app.use('/users', usersRouter);

在上面的例子中,我们首先使用require()函数导入路由模块,然后在应用程序中使用app.use()方法来注册路由模块。注意,在注册路由模块时,第一个参数"/users"代表的是路由模块的根路径。

这样,我们就成功地将路由定义模块化,并将其注册到应用程序中。

3. 异步路由

在Express应用程序中,我们还可以使用异步函数来实现异步路由。例如,下面的示例演示如何使用async/await来实现异步路由:

app.get('/async', async function(req, res) {
    const result = await someAsyncFunction();
    res.send('Async result: ' + result);
});

在上面的例子中,我们使用async来修饰路由处理函数,然后使用await关键字调用异步函数。当异步函数执行完毕后,我们将其返回值与字符串拼接后发送给客户端。

总的来说,路由在Express应用程序中是非常灵活和强大的,可以帮助我们定义应用程序的功能,提高代码的可读性和可维护性。

控制器的使用

在 Express 框架中,控制器通常指的是处理特定请求的函数,它们通常被称为路由处理程序 (route handlers)。控制器是为了提高应用程序的可维护性和可读性,将具体的业务逻辑和路由操作分离开来,从而使得每个路由处理程序只需要关注其自身的业务逻辑,而不用承担额外的业务职责。通常,使用控制器可以使得代码更具有可重用性,以及更容易进行调试和测试。

下面是在 Express 中创建一个控制器的一般步骤:

1. 创建路由。在你的 Express 应用程序中创建一个路由,用于处理 HTTP 请求。

const express = require('express');
const router = express.Router();

2. 编写控制器函数。编写具体的业务逻辑,并将其封装在一个函数中。

const myController = (req, res) => {
  // 处理业务逻辑
  res.send('Hello World!');
}

3. 将控制器函数绑定到路由。将你编写的控制器函数挂载到刚刚创建的路由中。

router.get('/myRoute', myController);

4. 在应用程序中使用该路由。将你创建的路由挂载到你的 Express 应用程序中。

const app = express();
app.use('/api', router);

这样,当你的应用程序接收到 GET /api/myRoute 的请求时,会自动调用 myController 函数来处理这个请求,并返回 'Hello World!' 给客户端。

请注意,这只是一个简单的示例。在实际使用中,你可能需要更多的控制器函数,并在应用程序中使用多个路由。此外,你可以在控制器函数中使用模型和数据库等数据操作,以执行更复杂的操作。

第四章:模板引擎

EJS模板引擎

EJS 是一种基于 JavaScript 的模板引擎,它允许你使用 JavaScript 代码在 HTML 中嵌入动态内容。

下面是在 Express 中使用 EJS 模板引擎的一般步骤:

1. 安装 EJS。从 npm 上安装 EJS 模板引擎。

npm install ejs

2. 配置 Express 应用程序。在你的 Express 应用程序中设置 EJS 作为视图引擎。

const express = require('express');
const app = express();
// 设置 EJS 视图引擎
app.set('view engine', 'ejs');

3. 创建一个 EJS 视图。在你的应用程序中创建一个 EJS 视图,用 EJS 语法编写你的 HTML 模板。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title><%= pageTitle %> - My App</title>
</head>
<body>
  <h1>Welcome to <%= appName %>!</h1>
</body>
</html>

4. 在路由控制器中使用 EJS 模板。在路由控制器中调用 res.render() 函数来使用 EJS 视图,并将需要动态替换的数据传递给视图。

app.get('/', (req, res) => {
  res.render('index', { pageTitle: 'Home', appName: 'My App' });
});

在这个例子中,EJS 变量 <%= pageTitle %><%= appName %> 将会被动态替换为 'Home''My App'。最终客户端将会看到一条欢迎语句和一个页面标题。

这只是一个简单的例子。使用 EJS 模板引擎,你可以轻松地创建更复杂的视图和交互元素,例如表格、表单、按钮等等。

Pug模板引擎

Pug(以前称为Jade)是一种基于缩进的模板引擎,它使用一种简洁的、类似于 Python 的语法来描述 HTML 的结构和内容。

下面是在 Express 中使用 Pug 模板引擎的一般步骤:

1. 安装 Pug。从 npm 上安装 Pug 模板引擎。

npm install pug

2. 配置 Express 应用程序。在你的 Express 应用程序中设置 Pug 作为视图引擎。

const express = require('express');
const app = express();
// 设置 Pug 视图引擎
app.set('view engine', 'pug');

3. 创建一个 Pug 视图。在你的应用程序中创建一个 Pug 视图,用 Pug 语法编写你的 HTML 模板。

<!DOCTYPE html>
html
  head
    meta(charset='UTF-8')
    title=pageTitle + ' - My App'
  body
    h1 Welcome to #{appName}!

4. 在路由控制器中使用 Pug 模板。在路由控制器中调用 res.render() 函数来使用 Pug 视图,并将需要动态替换的数据传递给视图。

app.get('/', (req, res) => {
  res.render('index', { pageTitle: 'Home', appName: 'My App' });
});

在这个例子中,Pug 变量 #{appName} 将会被动态替换为 'My App'。最终客户端将会看到一条欢迎语句和一个页面标题。

使用 Pug 模板引擎,你可以轻松地创建更复杂的视图和交互元素,例如表格、表单、按钮等等。

Mustache模板引擎

Mustache 是一种简单、轻量的模板引擎,可以应用于多种编程语言中。

它提供了一个非常简单的模板语言,用于将数据渲染HTML、XML 或纯文本

在 Express 中使用 Mustache 模板引擎的一般步骤为:

1. 安装 Mustache。从 npm 上安装 Mustache 模板引擎。

npm install mustache

2. 配置 Express 应用程序。在你的 Express 应用程序中设置 Mustache 作为视图引擎。

const express = require('express');
const app = express();
// 设置 Mustache 视图引擎
app.engine('mustache', require('mustache-express')());
app.set('view engine', 'mustache');
app.set('views', __dirname + '/views');

3. 创建一个 Mustache 视图。在你的应用程序中创建一个 Mustache 视图,用 Mustache 语法编写你的 HTML 模板。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>{{pageTitle}} - My App</title>
</head>
<body>
  <h1>Welcome to {{appName}}!</h1>
</body>
</html>

4. 在路由控制器中使用 Mustache 模板。在路由控制器中调用 res.render() 函数来使用 Mustache 视图,并将需要动态替换的数据传递给视图。

app.get('/', (req, res) => {
  res.render('index', { pageTitle: 'Home', appName: 'My App' });
});

在这个例子中,Mustache 变量 {{appName}} 将会被动态替换为 'My App'。最终客户端将会看到一条欢迎语句和一个页面标题。

使用 Mustache 模板引擎,你可以轻松地创建更复杂的视图和交互元素,例如表格、表单、按钮等等。

第五章:文件上传和下载

文件上传的原理和实现

文件上传通常涉及到两个部分:客户端和服务端

在Web应用中,我们通常使用HTTP协议进行文件传输

客户端:用户在页面上选择要上传的文件后,浏览器会将该文件通过HTTP协议传输到服务端。通常情况下,我们会使用HTML表单来生成上传控件,然后通过JavaScript监听表单提交事件,在提交前获取文件数据并使用FormData对象创建一个上传请求,再通过XMLHttpRequestfetch API将请求发送到服务端。

服务端:服务器接收到文件上传的请求后,通常会使用服务器端编程语言(如Node.js中的express框架)来处理请求,并将文件保存到服务器的指定目录中。在express框架中,可以使用multer中间件来处理文件上传的请求。multer支持多种上传方式,如多文件上传、限制文件大小等,并且提供了一些有用的API,如req.file和req.files,用于获取上传的文件数据

下面是一个使用express和multer实现文件上传的示例代码:

// 引入multer库
const multer = require('multer');
// 创建multer实例,指定上传目录和上传方式
const upload = multer({ dest: 'uploads/' });
// 处理POST请求
app.post('/upload', upload.single('file'), (req, res) => {
  // req.file是上传的文件对象
  console.log(req.file);
  res.status(200).send('上传成功');
});

在上面的代码中,我们首先引入了multer库,然后使用multer.create()方法创建一个multer实例,传入一个对象作为参数,其中dest属性指定了上传文件的保存目录。

然后,在处理POST请求的回调函数中,使用upload.single()方法指定了文件的上传方式,这里使用的是单文件上传。最后,我们通过req.file获取上传的文件对象,将其保存到指定的目录中,并返回上传成功的消息。


【利用AI让知识体系化】入门Express框架(三)https://developer.aliyun.com/article/1426063

相关文章
|
1天前
|
存储 人工智能 开发框架
Eliza:TypeScript 版开源 AI Agent 开发框架,快速搭建智能、个性的 Agents 系统
Eliza 是一个开源的多代理模拟框架,支持多平台连接、多模型集成,能够快速构建智能、高效的AI系统。
25 8
Eliza:TypeScript 版开源 AI Agent 开发框架,快速搭建智能、个性的 Agents 系统
|
4天前
|
人工智能 开发框架 算法
Qwen-Agent:阿里通义开源 AI Agent 应用开发框架,支持构建多智能体,具备自动记忆上下文等能力
Qwen-Agent 是阿里通义开源的一个基于 Qwen 模型的 Agent 应用开发框架,支持指令遵循、工具使用、规划和记忆能力,适用于构建复杂的智能代理应用。
60 10
Qwen-Agent:阿里通义开源 AI Agent 应用开发框架,支持构建多智能体,具备自动记忆上下文等能力
|
1天前
|
数据采集 人工智能 分布式计算
MaxFrame:链接大数据与AI的高效分布式计算框架深度评测与实践!
阿里云推出的MaxFrame是链接大数据与AI的分布式Python计算框架,提供类似Pandas的操作接口和分布式处理能力。本文从部署、功能验证到实际场景全面评测MaxFrame,涵盖分布式Pandas操作、大语言模型数据预处理及企业级应用。结果显示,MaxFrame在处理大规模数据时性能显著提升,代码兼容性强,适合从数据清洗到训练数据生成的全链路场景...
12 5
MaxFrame:链接大数据与AI的高效分布式计算框架深度评测与实践!
|
8天前
|
数据采集 人工智能 自然语言处理
Midscene.js:AI 驱动的 UI 自动化测试框架,支持自然语言交互,生成可视化报告
Midscene.js 是一款基于 AI 技术的 UI 自动化测试框架,通过自然语言交互简化测试流程,支持动作执行、数据查询和页面断言,提供可视化报告,适用于多种应用场景。
96 1
Midscene.js:AI 驱动的 UI 自动化测试框架,支持自然语言交互,生成可视化报告
|
5天前
|
人工智能 智能硬件
SPAR:智谱 AI 推出自我博弈训练框架,基于生成者和完善者两个角色的互动,提升了执行准确度和自我完善能力
SPAR 是智谱团队推出的自我博弈训练框架,旨在提升大型语言模型在指令遵循方面的能力,通过生成者和完善者的互动以及树搜索技术优化模型响应。
19 0
SPAR:智谱 AI 推出自我博弈训练框架,基于生成者和完善者两个角色的互动,提升了执行准确度和自我完善能力
|
18天前
|
机器学习/深度学习 人工智能 自然语言处理
AI技术深度解析:从基础到应用的全面介绍
人工智能(AI)技术的迅猛发展,正在深刻改变着我们的生活和工作方式。从自然语言处理(NLP)到机器学习,从神经网络到大型语言模型(LLM),AI技术的每一次进步都带来了前所未有的机遇和挑战。本文将从背景、历史、业务场景、Python代码示例、流程图以及如何上手等多个方面,对AI技术中的关键组件进行深度解析,为读者呈现一个全面而深入的AI技术世界。
90 10
|
6天前
|
机器学习/深度学习 人工智能 自动驾驶
企业内训|AI大模型在汽车行业的前沿应用研修-某汽车集团
本课程是TsingtaoAI为某汽车集团高级项目经理设计研发,课程全面系统地解析AI的发展历程、技术基础及其在汽车行业的深度应用。通过深入浅出的理论讲解、丰富的行业案例分析以及实战项目训练,学员将全面掌握机器学习、深度学习、NLP与CV等核心技术,了解自动驾驶、智能制造、车联网与智能营销等关键应用场景,洞悉AI技术对企业战略布局的深远影响。
135 97
|
11天前
|
机器学习/深度学习 人工智能 物联网
AI赋能大学计划·大模型技术与应用实战学生训练营——湖南大学站圆满结营
12月14日,由中国软件行业校园招聘与实习公共服务平台携手魔搭社区共同举办的AI赋能大学计划·大模型技术与产业趋势高校行AIGC项目实战营·湖南大学站圆满结营。
AI赋能大学计划·大模型技术与应用实战学生训练营——湖南大学站圆满结营
|
4天前
|
机器学习/深度学习 人工智能 自然语言处理
CogAgent-9B:智谱 AI 开源 GLM-PC 的基座模型,专注于预测和执行 GUI 操作,可应用于自动化交互任务
CogAgent-9B 是智谱AI基于 GLM-4V-9B 训练的专用Agent任务模型,支持高分辨率图像处理和双语交互,能够预测并执行GUI操作,广泛应用于自动化任务。
36 12
CogAgent-9B:智谱 AI 开源 GLM-PC 的基座模型,专注于预测和执行 GUI 操作,可应用于自动化交互任务
|
10天前
|
人工智能 前端开发 Java
Spring AI Alibaba + 通义千问,开发AI应用如此简单!!!
本文介绍了如何使用Spring AI Alibaba开发一个简单的AI对话应用。通过引入`spring-ai-alibaba-starter`依赖和配置API密钥,结合Spring Boot项目,只需几行代码即可实现与AI模型的交互。具体步骤包括创建Spring Boot项目、编写Controller处理对话请求以及前端页面展示对话内容。此外,文章还介绍了如何通过添加对话记忆功能,使AI能够理解上下文并进行连贯对话。最后,总结了Spring AI为Java开发者带来的便利,简化了AI应用的开发流程。
194 0