node服务器开发web项目,JavaScript之 Node 中开发web项目的框架 - express

node.js创建web应用的常用核心API模块 ,在前几篇文章已经介绍过fs文件系统 和path路径操作 ,以及http模块的核心API模块 ,通过这些API模块我们已经了解了运用node原生API如何来创建服务器

但是Node 中开发web项目的框架express提供了更加方便友好的创建web服务器的方式方法

什么是Express

一个快速的网站开发框架,封装了原生的http模块,用起来更方便;API更人性化

9a1e8f44493237d9d17132015b8cc690.pngexpress官方网站

express 框架的特点

基于Node.js平台之上,进一步封装了http模块,从而提供了更好用,更友好的 API使用Express创建网站,比使用原生的http模块更加方便;Express 并没有覆盖 原生 http 模块中的方法,而是基于 原生方法之上,做了更友好的封装,让用户体验更好express 框架的安装和基本使用

1.安装:运行 npm i express -S 即可安装

2.创建基本的express服务器:导入express第三方模块 ,通过app.get()app.post(方法,来监听客户端的get或post请求

例如:简单构建express服务器的步骤

aba37c51eb5bb437c9ca8038c02b1f03.png简单构建express服务器

express 中的快捷方法

1.res.send() 方法向客户端发送数据

支持 发送 字符串Content-Type: text/html;支持 发送 对象 或 数组Content-Type: application/json支持 发送 Buffer 此时会当作文件下载;

5f406c882aaa8f589edabbc7a0cc30c7.pngres.send方法可以发送的数据类型

2. res.sendFile() 方法向客户端发送文件

之前我们都是导入路径path模块和fs文件系统模块 ,来读取HTML文件,来向客户端发送内容

756b66f730fdf76f410e1802bb8c0802.png原生node提供的fs模块

通过express我们只要调用res.sendFile() 方法就能实现读取文件

用法1:res.sendFile(path.join(__dirname, './view/index.html'))用法2:res.sendFile('./view/movie.html', { root: __dirname })注意:res.sendFile()可以向浏览器发送 静态页面;

ef6e40be7d66c1681c24e2bfffe7e028.png必须是绝对路径

注意:1.sendFile 如果只给定一个参数的时候,这个参数必须是绝对路径,表示要发送给客户端的文件的路径 ,所以需要path模块来拼接路径

2. 为 res.sendFile 方法,提供两个参数进行调用 ,第一个实参就可以传递一个相对路径了;第二个实参,必须是一个绝对路径

使用express.static()快速托管静态资源

1.res.sendFile 访问文件的弊端

例如:之前创建的三个HTML页面我们可以通过这种方式来读取和访问页面 ,我们会发现只需要几行代码:

dd2d3844abb0542baab67f16bececa66.png使用 res.sendFile访问页面

如果我们网站中,有很多静态资源(HTML文件 ,css 文件,js文件和一些图片等)需要被访问 ,就会造成大量的代码重复 ,所以哦就不能使用这种方法了 ,此时,再使用 res.sendFile 就有点力不从心了

2.express.static方法的使用

这时候,express 框架,为我们提供了express.static('静态资源目录')来快速托管指定目录下的所有静态资源文件;

语法1:app.use(express.static('public'));app.use()方法:是专门用来注册 中间件;express.static: 是express的内置中间件 ,可以把 指定的 目录,托管为静态资源目录,这样,指定目录下的所有文件,都可以直接被 浏览器来访问语法2:app.use('/虚拟目录', express.static('public')) 可以在托管静态资源文件的时候,指定要挂载的虚拟路径例如/page ,访问的时候就必须/page/movie.html

97ad2f6a7077b6095e9f4626bc4a1077.pngexpress.static方法的使用

2d425cd850baa353e392416dc6b489fb.png虚拟路径访问

c00eb09fc50a62201e70b18a3882c986.png

举报/反馈

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值