Web 开发框架 — Express 精讲(安装使用、静态托管、路由处理、中间件的使用)(1)

本文涉及的产品
云原生网关 MSE Higress,422元/月
服务治理 MSE Sentinel/OpenSergo,Agent数量 不受限
Serverless 应用引擎免费试用套餐包,4320000 CU,有效期3个月
简介: Web 开发框架 — Express 精讲(安装使用、静态托管、路由处理、中间件的使用)(1)

一、Express 安装

       首先创建一个文件夹 study_Express 作为项目文件,在文件中创建入口文件 app.js;

image.png


在集成终端中使用命令 npm init -y 初始化一个 package.json 文件;


image.png


使用命令 npm install express -- save 下载 Express;安装成功后如下:

image.png



二、Express 使用

       下载 Express 之后,就可以正常使用了,在 app.js 中创建一个应用服务器示例;

// study_Express/app.js
const express = require('express') //require函数引入express包
const app = express() //调用函数
const port = 3000 //设置端口3000
app.get('/', (req, res) => {
  res.send('Hello World!') //app对象调用get API,监听根路径 /,有根路径请求时返回“Hello World!”
})
app.listen(port, () => {
  console.log(`Example app listening on port ${port}`) //监听3000端口,启动服务后触发回调函数
})

创建完成后启动服务;

image.png



此时我们查看本地地址的3000端口,就可以返回“Hello World!”;

image.png



以上就是一个最简单的应用服务器。


三、通过 Express 托管静态文件

       所谓托管静态文件就是让图片、文档、js/css/html文件等等可以通过 url 地址来访问;我们新建文件 static.js 来演示静态文件的托管;


// study_Express/static.js
const express = require('express') //require函数引入express包
const app = express() //调用函数
//实现静态资源服务
let server = app.use(express.static('public')) //public就是静态资源的根目录,静态资源放于此文件夹
server.listen(3000, () => { //创建监听
  console.log('服务器启动成功...')
})

提示:app.use 语句可以写多条设置多个静态资源的根目录,访问时互不影响。


在以上代码中我们设置的根目录为 public,所以创建此目录并添加示例文件 1.html 和 1.jpg 用于静态托管;

image.png



接下来,启动服务;

image.png



此时就可以在浏览器中通过 url 来访问我们刚刚添加的静态资源了。

image.png

image.png




除此之外,我们也可以为访问的路径设置一个虚拟目录,具体做法是在 app.use 后新加一个参数;如下,设置虚拟目录 /express;


let server = app.use('/express',express.static('public')) //use的第一个参数指定虚拟目录(路径)

提示:应用服务器文件无论做任何修改都需要重新启动服务。


接下来在访问静态资源的 url 中也需要加入这个虚拟目录;

image.png




四、路由处理

       根据请求路径和请求方式进行路径分发处理的就是路由;


       http 的常用请求方式有 post(添加)、get(查询)、put(更新)、delete(删除),即分别对应增删改查操作;我们新建文件 router.js 来演示路由处理:


// study_express/router.js
const express = require('express') //require函数引入express包
const app = express() //调用函数
//四种基本路由处理(处理特定请求)
app.get('/', (req, res) => {
  res.send('get数据!')
})
app.post('/', (req, res) => {
  res.send('post数据!')
})
app.put('/', (req, res) => {
  res.send('put数据!')
})
app.delete('/', (req, res) => {
  res.send('delete数据!')
})
//直接使用use分发可以处理所有的路由请求(处理所有请求)
// app.use((req,res) => {
//   res.send('ok!')
// })
app.listen(3000, () => { //创建监听
  console.log('router服务器启动成功...')
})

接下来进行接口测试,由于浏览器不太方便,这里我使用的是 ApiPost;


补充: ApiPost 测试接口方法


首先在 ApiPost 正常登录;

image.png


随后新建目录 --> 鼠标右键 --> 新建 --> 新建接口;


image.png


输入接口地址,我们使用的是本地地址、3000端口;

image.png



输入地址后,启动服务器;

image.png



接下来选择发送方式进行测试:

image.png



测试结果如下:


image.png

image.png


相关文章
|
2月前
|
开发框架 JavaScript 前端开发
使用 Node.js 和 Express 构建 Web 应用
【10月更文挑战第2天】使用 Node.js 和 Express 构建 Web 应用
|
25天前
|
Web App开发 JSON JavaScript
Node.js 中的中间件机制与 Express 应用
Node.js 中的中间件机制与 Express 应用
|
2月前
|
Web App开发 JavaScript 前端开发
使用Node.js和Express框架构建Web服务器
使用Node.js和Express框架构建Web服务器
|
3月前
|
缓存 JavaScript 中间件
优化Express.js应用程序性能:缓存策略、请求压缩和路由匹配
在开发Express.js应用时,采用合理的缓存策略、请求压缩及优化路由匹配可大幅提升性能。本文介绍如何利用`express.static`实现缓存、`compression`中间件压缩响应数据,并通过精确匹配、模块化路由及参数化路由提高路由处理效率,从而打造高效应用。
192 13
|
3月前
|
中间件 API 开发者
深入理解Python Web框架:中间件的工作原理与应用策略
在Python Web开发中,中间件位于请求处理的关键位置,提供强大的扩展能力。本文通过问答形式,探讨中间件的工作原理、应用场景及实践策略,并以Flask和Django为例展示具体实现。中间件可以在请求到达视图前或响应返回后执行代码,实现日志记录、权限验证等功能。Flask通过装饰器模拟中间件行为,而Django则提供官方中间件系统,允许在不同阶段扩展功能。合理制定中间件策略能显著提升应用的灵活性和可扩展性。
50 4
|
3月前
|
缓存 中间件 网络架构
Python Web开发实战:高效利用路由与中间件提升应用性能
在Python Web开发中,路由和中间件是构建高效、可扩展应用的核心组件。路由通过装饰器如`@app.route()`将HTTP请求映射到处理函数;中间件则在请求处理流程中插入自定义逻辑,如日志记录和验证。合理设计路由和中间件能显著提升应用性能和可维护性。本文以Flask为例,详细介绍如何优化路由、避免冲突、使用蓝图管理大型应用,并通过中间件实现缓存、请求验证及异常处理等功能,帮助你构建快速且健壮的Web应用。
34 1
|
5月前
|
JSON 中间件 数据处理
实践出真知:通过项目学习Python Web框架的路由与中间件设计
【7月更文挑战第19天】探索Python Web开发,掌握Flask或Django的关键在于理解路由和中间件。路由连接URL与功能,如Flask中@app.route()定义请求响应路径。中间件在请求处理前后执行,提供扩展功能,如日志、认证。通过实践项目,不仅学习理论,还能提升构建高效Web应用的能力。示例代码展示路由定义及模拟中间件行为,强调动手实践的重要性。
60 1
|
6月前
|
JSON 中间件 API
中间件API示例(以Express.js为例)
【6月更文挑战第14天】
51 8
|
5月前
|
缓存 中间件 网络架构
Python Web开发实战:高效利用路由与中间件提升应用性能
【7月更文挑战第20天】在Python Web开发中,路由与中间件是构建高效应用的核心。路由通过装饰器如`@app.route()`在Flask中映射请求至处理函数;中间件(如`@app.before_request`, `@app.after_request`)则在请求流程中插入自定义逻辑。优化路由包括减少冲突、利用动态参数及蓝图;中间件可用于缓存响应、请求验证和异常处理,显著提升性能和可维护性。良好设计是关键,示例代码展示了如何在Flask中实现这些策略。
63 0
|
5月前
|
中间件 数据库 开发者
解析Python Web框架的四大支柱:模板、ORM、中间件与路由
【7月更文挑战第20天】Python Web框架如Django、Flask、FastAPI的核心包括模板(如Django的DTL和Flask的Jinja2)、ORM(Django的内置ORM与Flask的SQLAlchemy)、中间件(Django的全局中间件与Flask的装饰器实现)和路由(Django的urls.py配置与Flask的@app.route()装饰器)。这些组件提升了代码组织和数据库操作的便捷性,确保了Web应用的稳定性和可扩展性。
70 0

热门文章

最新文章