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

本文涉及的产品
Serverless 应用引擎免费试用套餐包,4320000 CU,有效期3个月
云原生网关 MSE Higress,422元/月
注册配置 MSE Nacos/ZooKeeper,118元/月
简介: 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月前
|
数据采集 中间件 开发者
Scrapy爬虫框架-自定义中间件
Scrapy爬虫框架-自定义中间件
58 1
|
2月前
|
开发框架 JavaScript 前端开发
使用 Node.js 和 Express 构建 Web 应用
【10月更文挑战第2天】使用 Node.js 和 Express 构建 Web 应用
|
4月前
|
存储 JavaScript NoSQL
构建高效Web应用:使用Node.js和Express框架
【8月更文挑战第30天】本文将引导你了解如何使用Node.js和Express框架快速搭建一个高效的Web应用。通过实际的代码示例,我们将展示如何创建一个简单的API服务,并讨论如何利用中间件来增强应用功能。无论你是新手还是有经验的开发者,这篇文章都将为你提供有价值的见解。
|
5月前
|
开发框架 JSON API
震撼发布!Python Web开发框架下的RESTful API设计全攻略,让数据交互更自由!
【7月更文挑战第22天】在Python Web开发中,设计高效的RESTful API涉及选择框架(如Flask或Django)、明确资源及使用HTTP方法(GET, POST, PUT, DELETE)来操作数据。响应格式通常是JSON,错误处理也很重要。示例展示了使用Flask创建图书管理API,包括版本控制、文档化、安全性和性能优化是最佳实践。这样的API使数据交互更顺畅。
98 2
|
1月前
|
消息中间件 NoSQL Java
springboot整合常用中间件框架案例
该项目是Spring Boot集成整合案例,涵盖多种中间件的使用示例,每个案例项目使用最小依赖,便于直接应用到自己的项目中。包括MyBatis、Redis、MongoDB、MQ、ES等的整合示例。
103 1
|
2月前
|
Web App开发 JavaScript 前端开发
使用Node.js和Express框架构建Web服务器
使用Node.js和Express框架构建Web服务器
|
3月前
|
Web App开发 JavaScript 前端开发
构建高效Web应用:Node.js与Express框架的深度整合
【9月更文挑战第28天】在现代Web开发领域,Node.js和Express框架的结合已成为打造高性能、易扩展应用的黄金组合。本文将深入探讨如何利用这一技术栈优化Web应用架构,提供具体实践指导,并分析其性能提升的内在机制。通过代码示例,我们将展示从基础搭建到高级功能的实现过程,旨在为开发者提供一条清晰的学习路径,以实现技术升级和项目效率的双重提升。
54 3
|
3月前
|
JSON JavaScript 前端开发
构建高效Web应用:Node.js与Express框架的完美结合
【9月更文挑战第28天】在现代Web开发中,Node.js和Express框架的结合为创建高性能、易扩展的应用提供了强有力的支持。本文将深入探讨如何利用这两种技术构建一个简单但功能强大的Web服务,同时提供代码示例以加深理解。
|
4月前
|
JavaScript PHP 开发者
PHP中的异常处理与自定义错误处理器构建高效Web应用:Node.js与Express框架实战指南
【8月更文挑战第27天】在PHP编程世界中,异常处理和错误管理是代码健壮性的关键。本文将深入探讨PHP的异常处理机制,并指导你如何创建自定义错误处理器,以便优雅地管理运行时错误。我们将一起学习如何使用try-catch块捕获异常,以及如何通过set_error_handler函数定制错误响应。准备好让你的代码变得更加可靠,同时提供更友好的错误信息给最终用户。
|
5月前
|
缓存 监控 安全
中间件在Python Web框架中的角色与应用场景
【7月更文挑战第21天】中间件在Python Web开发中作为服务器与应用间的软件层,拦截、处理请求和响应,无需改动应用代码。它扩展框架功能,复用跨应用逻辑,加强安全,优化性能。如Django中间件处理请求/响应,Flask通过WSGI中间件实现类似功能,两者均在不触及核心代码前提下,灵活增强应用行为,是现代Web开发关键组件。
60 0