Node.js-Express框架
基本用法
1.Express框架是作为NodeJS的软件包存在的,因此我们需要先下载安装,然后再使用它。
mkdir express-demo && cd express-demo
npm init --yes
npm install express --save-prod
2.创建app.js文件,并在文件引入express
// 引入 express 模块
const express = require('express');
3.express是Express框架中导出的一个函数,供我们创建应用
// 使用 express 函数创建一个应用
const app = express();
4.配置请求路径以及路径被匹配时的处理方法(处理方法的数量可以是任意的)
// 当路径 '/' 被匹配时,至少可以执行一个函数,后面的函数要想执行,前一个函数必须要调用 next() 方法
app.get('/', function (request, response, next) {console.log('fun1')next();
}, function (request, response, next) {console.log('fun2')response.end('end')
});
5.启动服务器,并监听特定的端口
// 指定服务器监听的端口
const port = 3000;app.listen(port, () => {console.log(`Server running at http://localhost:${port}`)
})
6.目前,服务器只能接收一个GET请求,接下来我们来配置一个能够接收POST请求的路径(路由)
// 配置接收 POST 请求的路由
app.post('/doLogin', (request, response, next) => {console.log(request.url, 'fun1')next()
}, (request, response, next) => {console.log(request.url, 'fun2')response.end('post end')
})
路由基础
路由是指应用程序如何响应客户端对特定端点的请求,它是一个URI(路径)和一个特定的http请求方法(GET,POST等等)。
每一个路由都可以有一个或多个处理程序函数,这些函数在路由匹配时执行。
定义路由的结构如下:
app.method(path, handler)
app 是express的一个实例
method 表示一个HTTP请求方法,写成小写形式
path 表示服务器上的一个路径
handler 表示匹配路由时执行的函数
举例说明如何定义简单的路由。
// 在主页上响应 'Hello World!'
app.get('/', (req, res) => {res.send('Hello World!')
})// 响应根路由(/)上的POST请求
app.post('/', (req, res) => {res.send('Got a POST request')
})// '/user' 路由上 PUT 请求的响应
app.put('/user', (req, res) => {res.send('Got a PUT request at /user')
})// '/user' 路由上 DELETE 请求的响应
app.delete('/user', (req, res) => {res.send('Got a DELETE request at /user')
})
有一个特殊的路由方法 app.all(),用于在所有HTTP请求方法的路径上加载中间函数。无论HTTP请求方法是什么,只有你的请求路径匹配’/user’,都会执行对应的处理函数。
app.all('/user', (req, res) => {console.log()res.send('Got all request at /user')
})
路由路径
请求方法与路由路径共同组成了可以向其发出请求的端点(目标),路由的路径可以是字符串、字符串模式或正则表达式。
字符 ?、+、*和() 使用正则表达式对应项的子集。连接符(-)和点(.)有基于字符串的路径逐字解释。
如果你需要在路径字符串中使用美元符号(),请将转义之后的美元符号放在中括号中[]。例如,位于’/data/),请将转义之后的美元符号放在中括号中[]。例如,位于’/data/),请将转义之后的美元符号放在中括号中[]。例如,位于’/data/book’路径中$符号将是/data/([$])book”
下面是一些基于字符串的路由示例:
// 这个路由路径将会匹配根路由 /
app.get('/', function (req, res) {res.send('root')
})// 这个路由路径将会匹配根路由 /about.
app.get('/about', function (req, res) {res.send('about')
})// 这个路由路径将会匹配根路由 /random.text,路由路径中的点(.)会被作为路径的一部分,没有什么特殊的意义.
app.get('/random.text', function (req, res) {res.send('random.text')
})
下面是一些基于字符串模式的路由路径示例:
// 这个路由路径将会匹配 /acd 和 /abcd,问号表示 0 个或 1 个字符
app.get('/ab?cd', (req, res) => {res.send('ab?cd')
})// 这个路由路径将会匹配 /abcd, /abbcd,以此类推。加号表示 1 个或多个个字符
app.get('/ab+cd', (req, res) => {res.send('ab?cd')
})// 星号表示 ab 和 cd 之间可以有任意数量的任意字符,包括 0 个字符
app.get('/ab*cd', (req, res) => {res.send('ab?cd')
})//这个路由路径将会匹配 /abe 和 /abcde
app.get('/ab(cd)?e', (req, res) => {res.send('ab?cd')
})
下面是一些基于正则表达式的路由路径示例:
// 这个路径将匹配任何带有 'abc' 的路由
app.get(/abc/, (req, res) => {res.send('abc')
})// . 表示任意字符
// * 表示 0 个或多个字符
// $ 表示以 fly 结尾
// 匹配任何一 fly 结尾的路径
app.get(/.*fly$/, (req, res) => {res.send('/.*fly$/')
})
路由参数
路由参数是路由路径中的片段,用于捕获请求路径中特定位置的值。捕获的值位于req.params对象中,路由中指定的路由参数的名称作为它们各自的键名。例如,路由路径中具有2个路由参数,名称分别是:user_id和:book_id。
路由参数会被作为req.params对象的属性存在,路由参数是属性名,前台传入的数据是对应的属性值。
// 获取指定用户写某一本书
app.get('/users/:user_id/books/:book_id', (req, res) => {res.send('获取用户ID为:' + req.params.user_id +
'写的ID为:' + req.params.book_id + '的书。')
})
浏览器地址栏中的URL为http://localhost:3000/users/123/books/01,123会被传递给user_id,01会被传递给book_id。
查询参数
URL的组成部分:
http://www.example.com/myweb/users?name=zhangsan&gender=male#heading
http:协议
www.example.com 域名
/myweb/ 虚拟目录
users 目标资源
name=zhangsan&gender=male 查询参数
#heading 锚点
app.get('/myweb/users', (req, res) => {// 前台传入的查询参数都位于 req.query 对象中console.log(req.query.name, req.query.age)res.send('请求成功')
})
POST请求提交的数据
POST 表单提交过来数据都位于 req.body 对象中,默认情况下,request对象中是没有body属性的。我们需要先对POST请求的请求体进行解码,然后才能访问req.body对象中的数据。
//1. 对使用 application/x-www-form-urlencoded 编码数据进行解析
app.use('/', express.urlencoded({ extended: true }))// 2. 登录
app.post('/admin/doLogin', (req, res) => {// POST 表单提交过来数据都位于 req.body 对象中// 但是,在获取数据之前,必须要告诉服务怎样进行解码// req 对象没有 body 属性console.log(req.body.username)console.log(req.body.password)res.send('登录成功')
})
使用模板引擎
1、安装EJS模板引擎
npm install ejs --save-prod
2、配置模板引擎
// 告诉 Express我们要使用的模板引擎为 EJS
app.set('view engine', 'ejs');// 告诉 Express 模板文件在 views 目录下
app.set('views', './views');
3、配置路由,当路由被匹配时,要渲染的模板文件
app.get('/', (req, res) => {res.render('index', { title: 'Home Page' })
})app.get('/about', (req, res) => {res.render('about', { title: 'About Page' })
})
托管静态资源
在项目的根目录下,创建一个用于存放静态资源的目录,例如,public目录,并让Express帮我们托管目录中静态资源。
// 让Express帮我们托管目录中静态资源。
app.use(express.static('./public'))
在public目录下创建css目录,然后在css/目录下创建style.css文件
h1 {color: red;
}
接下来,我们就可以在模板文件中使用这些静态资源
// 引入css文件
<link rel="stylesheet" href="/css/style.css">
<%# / 就代表 http://localhost:3000/public/ %>
// 引入图片文件<img src="/images/photo.png" alt="沙滩">
拆分路由
随着项目的开发,app.js文件中的内容变得越来越多,逻辑越来越复杂,不利己后期调试和维护。为了解决这个问题,我们可以将业务相关的内容拆分到单独的文件中。
1、新建routes/文件夹,然后在文件夹中创建user-auth.js文件。
const express = require('express');// 创建一个路由器对象
const router = express.Router();// 在路由器对象中配置路由
router.get('/doLogin', (req, res) => {res.render('login', { title: '欢迎登陆' })
})router.get('/doLogout', (req, res) => {res.render('logout', { title: 'About Page' })
})router.get('/doRegister', (req, res) => {res.render('register', { title: 'About Page' })
})// 将路由器对象导出
exports = module.exports = router
2、在app.js文件导入user-auth.js文件
// 导入用户身份校验的模块
const userAuthRouter = require('./routes/users-auth.js');
3、使用app.use()启用userAuthRouter对象中配置的路由
app.use('/users', userAuthRouter)
4、在浏览器中访问时,完整的请求路径是由两部分拼接而成的。例如,访问登陆页面时,完整的路径为:
http://localhost:3000/users/doLogin
/users 位于 app.js 文件中
/doLogin 位于 user-auth.js 文件中
Node.js-Express框架相关推荐
- Node.js Express 框架 Express
Express 简介 Express 是一个简洁而灵活的 node.js Web应用框架, 提供了一系列强大特性帮助你创建各种 Web 应用,和丰富的 HTTP 工具. 使用 Express 可以快速 ...
- node.js Express框架入门
一.为什么要用Express框架? Node.js由于不需要另外的HTTP服务器,因此减少了一层抽象,给性能带了不少的提升,同时也因此提高了开发难度,实现一个POST数据的表单,例如: <for ...
- Node.js Express 框架 GET方法
GET 方法 以下实例演示了在表单中通过 GET 方法提交两个参数,我们可以使用 server.js 文件内的 process_get 路由器来处理输入: index.htm 文件代码如下: < ...
- Fastify 2.2.0 和 1.14.5 发布,极速 Node.js Web 框架
百度智能云 云生态狂欢季 热门云产品1折起>>> Fastify 2.2.0 和 1.14.5 发布了.Fastify 是一个高度专注于以最少开销和强大的插件架构为开发者提供最佳 ...
- Fastify 2.0.1 和 1.14.3 发布,极速 Node.js Web 框架
开发四年只会写业务代码,分布式高并发都不会还做程序员? Fastify 2.0.1 和 1.14.3 发布了.Fastify 是一个高度专注于以最少开销和强大的插件架构为开发者提供最佳体验的 We ...
- Node.js 后端框架排名
根据 GitHub Star 数量作了个 Node.js 后端框架排名,发布时间以首个版本发布(0.x)为准. 结果如下: 排名 框架名称 star数 语言 首个版本发布时间 查看项目 备注 1 ex ...
- node.js + express 初体验【hello world】
[node.js] 一个神奇的XX 呵呵 :) 不知道怎么形容他才好! [express] 是node.js 开发web应用程序的框架 开发环境:XP 大家共同进步吧 :) 一:前期准备: ...
- Node.js Express+Mongodb 项目实战
Node.js Express+Mongodb 项目实战 这是一个简单的商品管理系统的小项目,包含的功能还算挺全的,项目涵盖了登录.注册,图片上传以及对商品进行增.删.查.改等操作,对于新手来说是个很 ...
- 10个最好的 Node.js MVC 框架
Node.js 是最流行的 JavaScript 服务端平台,它允许建立可扩展的 Web 应用程序.Node.js 包含不同类型的框架,如 MVC 框架.全栈框架.REST API 以及大量的服务器 ...
- 使用Node.js express 开发上传文件/图片api接口
我是傲夫靠斯,欢迎关注我的公众号[前端工程师的自我修养],每天更新. 今天我们来搞一个Node.js Express的上传文件功能,我使用了busboy这个库. Busboy是一个基于事件的文件流解析 ...
最新文章
- 【怎样写代码】偷窥高手 -- 反射技术(二):窥视内部
- linux iptables导致httpd网页打不开
- 使用政府开放数据和低代码方案构建应用
- Java生成随机数的几种高级用法
- 漫步线性代数九——求Ax=0和Ax=b
- 【算法】—— 相邻两数的最大差值
- ##MySql数据库的增删改查方法
- ubuntu和centos 编译安装nginx及常用命令
- Spring-core-AnnotationAttributes
- JavaScript学习(八十七)—流程控制语句的总结,超级详细!!!
- 如何成为一枝独秀的技术领导者?
- 2021东营高考成绩查询,2021东营市地区高考成绩排名查询,东营市高考各高中成绩喜报榜单...
- matlab二阶系统曲线,基于matlab的二阶系统的阶跃响应曲线分析
- Python常用音频库
- iPhone手机越狱不只是为了安装盗版应用、越狱的十大好处
- 信息安全——密码学(下)
- Adobe Spark试用手记
- 数学基础-概率论01(离散型分布)
- Android储存 文件储存
- 微信小程序之二级联动下拉列表