南京建设项目环评公示期网站,html教程书,学平面设计去哪个机构,百度商家平台登录✍️ 作者简介: 前端新手学习中。 #x1f482; 作者主页: 作者主页查看更多前端教学 #x1f393; 专栏分享#xff1a;css重难点教学 Node.js教学 从头开始学习 目录 初识Express Express简介 什么是Express 进一步理解 Express Express能做什么 Express的基本使用 … ✍️ 作者简介: 前端新手学习中。 作者主页: 作者主页查看更多前端教学 专栏分享css重难点教学 Node.js教学 从头开始学习 目录 初识Express Express简介 什么是Express 进一步理解 Express Express能做什么 Express的基本使用 安装 创建基本的Web服务器 监听GET请求 监听post请求 获取URL中携带的查询参数 获取URL中的动态参数
初始Express 托管静态资源 express.static() 挂载路径前缀 nodemon 为什么要使用nodemon 安装 nodemon 使用nodemon
Express 路由 路由的概念 什么是路由 现实生活中的路由 Express中的路由 路由的匹配过程 路由的使用 最简单的用法 模块化路由 创建路由模块 Express中间件 中间件的概念 什么是中间件 现实生活中的例子 Express中间件的调用流程 Express中间件的格式 next函数的作用 Express中间件的初体验 定义中间件函数 触发使用中间件函数 初识Express Express简介 什么是Express
官方给出的概念Express是基于Node.js平台快捷开放极简的Web开发框架 通俗的理解Express的作用和Node.js内置的http模块类似是专门用来创建Web服务器的。
Express的本质就是一个npm上的第三包提供了快速创建Web服务器的便捷方法。
Express的中文官网express官网 进一步理解 Express
Express的开发效率更高http内置模块用起来很复杂开发效率低Express是基于内置的http模块进一步封装出来的。能够极大地提高开发效率。
http内置模块与Express类似于WebAPI和jquery的关系后者是基于前者进一步封装出来的 Express能做什么
对于前端程序员来说最常见的两种服务器分别是
Web网站服务器专门对外提供Web网页资源的服务器。API接口服务器专门对外提供API接口的服务器。
使用Express我们可以方便快捷的创建Web网站的服务器或API接口的服务器。 Express的基本使用 安装
在项目所处的根目录中运行如下的终端命令就可以安装express到项目中使用。
npm i express4.17.1 尽量安装指定版本 避免后面有什么不一样的 出错 创建基本的Web服务器
使用npm下载完第三方包之后使用expres创建服务器
//导入express
const express require(express);
//创建Web服务器
const app express();
//监听服务器
app.listen(8080, () {console.log(服务器创建成功);
}) 监听GET请求
通过app.get方法监听客户端的GET请求。
//监听get请求
app.get(/user, (req, res) {//res.sen方法向客户端响应数据res.send({name: xiaoxie,age: 20,gender: 男})
}) 启动服务器 在postCode中输入地址发送get请求拿到数据。 监听post请求
通过app.post方法可以监听客户端的post请求。
app.post(/user, (req, res) {res.send(请求成功)
}) 获取URL中携带的查询参数
通过req.query对象可以访问到客户端通过查询字符串的形式发送到服务器的参数
就是将ajax中通过serialize()方法得到的键值对字符串 转换成对象。
app.get(/, (req, res) {//默认情况下 是一个空对象console.log(req.query);res.send(req.query);
})在地址栏问号后面写跟再params里写是一样的。 获取URL中的动态参数
通过req.params对象可以访问到URL中通过匹配动态参数冒号是固定写法表示后面是动态参数显示名称id可以自定义任何名称。
app.get(/user/:id/:name, (req, res) {//默认情况下 是一个空对象console.log(req.params);res.send(req.params);
})初始Express 托管静态资源 express.static() express提供了一个非常好用的函数叫做express.static通过它我们可以非常方便地创建一个静态资源管理器例如通过以下代码就可以将public目录下的图片CSS文件JavaScript文件对外开放访问了。 我们将前面的时钟案例clock文件夹对外开放。 // 将clock目录对外开放//导入expressconst express require(express);
//实例化
const app express();
//使用express.static方法快速对外提供静态资源
app.use(express.static(./时钟/clock))//监听
app.listen(8080, () {console.log(访问成功 地址为http://127.0.0.1:8080);
})
直接在路径栏里进行访问访问的时候文件夹需要省略直接写文件名即可。 如果挂载多个文件夹且有相同的文件名咋按从上到下书写的先后顺序来显示 第一个文件。 挂载路径前缀
我们可以在地址栏访问指定文件前可以加上伪装的文件夹名。
这个abc 并不是真实存在的文件夹只是在地址栏访问时必须需要加上这个前缀名。
app.use(abc, express.static(./时钟/clock)) nodemon 为什么要使用nodemon 在编写测试Node.js项目的时候如果修改了项目的代码则需要频繁的手动close掉然后重复启动非常繁琐现在我们可以使用nodemon这个工具他能够监听项目文件的变动当代码被修改后nodemon会自动帮我们重启项目极大方便了开发和测试。 安装 nodemon
全局安装nodemon。
npm i nodemon -g 使用nodemon
nodemon 文件名
运行之后只要修改文件保存后就会自动重启项目。
Express 路由 路由的概念 什么是路由
广义上来讲路由就是映射关系。 现实生活中的路由 Express中的路由 在Express中路由指的是客户端的请求与服务器处理函数之间的映射关系。 Express中的路由分3部分组成分别是请求的类型请求的URL地址处理函数。 路由的匹配过程 每当一个请求到达服务器之后需要先经过路由的匹配只有匹配成功之后才会调用对应的处理函数。 在匹配时会按照路由的顺序进行匹配如果请求类型和请求的URL同时匹配成功则Express会将这次请求转交给对应的function函数进行处理。 路由的使用 最简单的用法
在Express中使用路由器最简单的方式就是把路由挂载到app上。
const express require(express);
const app express();app.get(/, (req, res) {res.send(hello world)
})app.post(/, (req, res) {res.send(hello post)
})app.listen(8080, () {console.log(http:127.0.0.1:8080);
}) 模块化路由 为了方便对路由进行模块化的管理EXpress不建议将路由直接挂载到app上而是推荐将路由抽离为单独的模块。 将路由抽离为单独模块的步骤如下
创建路由模块对应的js文件调用express.Router函数创建路由对象向路由对象上挂载具体的路由使用module.exports向外共享路由对象使用app.use函数注册路由模块创建路由模块
在一个新js文件里创建路由模块并向外暴露。
//这是路由模块//导入express
const express require(express);
//创建路由对象
const router express.Router();//挂载具体的路由router.get(/user/list, (req, res) {res.send(Get user list)
})router.post(/user/add, (req, res) {res.send(Add new user);
})//向外曝光路由对象
module.exports router;
导入并注册路由模块。
const express require(express);
const app express();//导入路由模块
const router require(./route.js)
//注册路由模块
app.use(router);app.listen(8080, () {console.log(http:127.0.0.1:8080);
}) 注意 app.use的作用就是用来注册全局中间件 为路由模块添加访问前缀
const express require(express);
const app express();//导入路由模块
const router require(./route.js)
//注册路由模块
//添加前缀
app.use(/api, router);app.listen(8080, () {console.log(http:127.0.0.1:8080);
}) Express中间件 中间件的概念 什么是中间件 中间件特指业务流程的中间处理环节。 现实生活中的例子 在处理污水的时候一般都要经过三个处理环节从而保证处理过后的废水达到排放标准。 Express中间件的调用流程 当一个请求到达Express的服务器之后可以连续调用多个中间件从而对这次请求进行预处理。 Express中间件的格式 Express的中间件本质上就是一个function处理函数Express中间件的格式如下 注意中间件函数的形参列表中必须包含next参数。而路由处理函数中只包含req和res。 next函数的作用 next函数是实现多个中间件连续调用的关键它表示把流转关系转交给下一个中间件或路由。 Express中间件的初体验 定义中间件函数
可以通过如下的方式定义一个最简单的中间件函数
const express require(express);const app express();//定义一个简单的中间件函数const mw function (req, res, next) {console.log(这是最简单的中间件函数);//把流转关系转交给下一个中间件next()
}app.listen(8080, () {console.log(http://localhost:8080);
}) 触发使用中间件函数 客户端发起的任何需求到达服务器之后都会触发的中间件叫做全局生效的中间件。 通过调用app.use中间件函数即可定义一个全局生效的中间件。 //定义一个简单的中间件函数const mw function (req, res, next) {console.log(这是最简单的中间件函数);//把流转关系转交给下一个中间件next()
}//全局生效的中间件
app.use(mw)
