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

本文涉及的产品
服务治理 MSE Sentinel/OpenSergo,Agent数量 不受限
简介: 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


相关文章
|
1月前
|
开发框架 JavaScript 安全
js开发:请解释什么是Express框架,以及它在项目中的作用。
【4月更文挑战第24天】Express是Node.js的Web开发框架,简化路由管理,支持HTTP请求处理。它包含中间件系统用于日志、错误处理和静态文件服务,集成多种模板引擎如EJS、Jade、Pug。框架还提供安全中间件提升应用安全,并具有良好的可扩展性,便于项目功能扩展和开发效率提升。
48 3
|
18天前
|
JavaScript 前端开发 中间件
Express框架搭建项目 node.js
【6月更文挑战第3天】这篇文章是关于使用Express框架构建Node.js Web应用的教程。Express是一个轻量级、功能丰富的框架,特点包括简洁灵活的核心、强大的中间件支持、灵活的路由系统和模板引擎兼容性。文章介绍了如何安装Express,并通过一个简单的示例展示了如何创建一个基本的Web服务器。最后,鼓励读者继续学习和实践,以充分利用Express和Node.js的能力。
23 1
|
5天前
|
JSON 中间件 数据格式
Gin框架学习笔记(五) ——文件上传与路由中间件
Gin框架学习笔记(五) ——文件上传与路由中间件
|
8天前
|
JSON JavaScript 中间件
Node.js Express 框架
Node.js Express 框架
12 0
|
26天前
|
Web App开发 JavaScript Cloud Native
构建高效可扩展的RESTful API:Node.js与Express框架实践指南构建未来:云原生架构在企业数字化转型中的关键作用
【5月更文挑战第29天】 在数字化时代的驱动下,后端服务架构的稳定性与效率成为企业竞争力的关键。本文深入探讨了如何利用Node.js结合Express框架构建一个高效且可扩展的RESTful API。我们将从设计理念、核心模块、中间件应用以及性能优化等方面进行系统性阐述。通过实例引导读者理解RESTful接口设计的最佳实践,并展示如何应对大规模并发请求的挑战,确保系统的高可用性与安全性。
|
27天前
|
Web App开发 JavaScript 前端开发
构建高效Web API:使用Node.js与Express框架
构建高效Web API:使用Node.js与Express框架
22 0
|
1月前
|
缓存 前端开发 安全
Python web框架fastapi中间件的使用,CORS跨域详解
Python web框架fastapi中间件的使用,CORS跨域详解
|
1月前
|
开发框架 前端开发 数据库
Python从入门到精通:3.3.2 深入学习Python库和框架:Web开发框架的探索与实践
Python从入门到精通:3.3.2 深入学习Python库和框架:Web开发框架的探索与实践
|
1月前
|
开发框架 JavaScript 前端开发
【Node系列】Express 框架
Express.js 是一个基于 Node.js 平台的极简、灵活的 web 应用开发框架,提供一系列强大的特性来帮助你创建各种 web 和移动设备应用。
41 2
|
1月前
|
开发框架 JavaScript 中间件
深入探索Node.js的Express框架:使用与中间件详解
【4月更文挑战第30天】本文深入探讨了Node.js的Express框架,介绍了其作为Web开发的强大工具,主要聚焦于基本使用和中间件。Express是基于Node.js的Web应用框架,用于构建高效的应用和API。文章详细讲解了如何安装Express,创建简单应用,以及中间件的工作原理和应用,包括中间件的顺序、错误处理和挂载位置。此外,还提到了使用第三方中间件扩展功能。理解Express基础和中间件对于开发高质量Web应用至关重要。