Node4-5静态资源服务器实战以及优化压缩文件实例内容


Posted in Javascript onAugust 29, 2019

浏览器控制台看一下RequestHeader有一个Accept-Encoding,而RespondHeaders中也会有一个Content-Encoding和他进行对应.

Accept-Encoding当我们的浏览器发起一个文件的请求时告诉服务器支持哪几种压缩方式,也就是服务器用这几种压缩方式浏览器都能解压,当服务器接收到请求后,知道浏览器支持的压缩方式,服务器就会自动识别其中一种进行压缩并且告诉浏览器自己用了哪个方式压缩,浏览器知道后就知道用哪种对应方式解压了

 Node4-5静态资源服务器实战以及优化压缩文件实例内容

 Node4-5静态资源服务器实战以及优化压缩文件实例内容

 根据拓展名限制一下支持的几钟压缩类型

defaultConfig.js

Node4-5静态资源服务器实战以及优化压缩文件实例内容

压缩方法 compress,js

//压缩的方法
/**rs 肯定需要,要知道自己需要压缩什么  客户端(浏览器支持哪几种压缩类型),
 * req 客户端再requestHeader中声明的
 * res 压缩完成之后,需要告诉浏览器使用哪种压缩类型压缩,方便浏览器用对应方式进行解压
 * */
const {
  createGzip,
  CreateDeflate
} = require('zlib')
module.exports = (rs, req, res) => {
  const acceptEncoding = req.headers['accept-encoding'];
  /* 有两种情况不能压缩
  1.浏览器已经声明不支持任何压缩方式,拿不到这个信息
  2.拿到的东西里面没有服务器支持
  */
  if (!acceptEncoding || !acceptEncoding.match(/\b(gzip|deflate)/)) {
    return rs
  } else if (acceptEncoding.match(/\bgzip\b/)) {
    {
      res.setHeader('Content-Encoding', 'gzip')
      return rs.pipe(createGzip())
    }
  }else if (acceptEncoding.match(/\bdeflate\b/)) {
    {
      res.setHeader('Content-Encoding', 'deflate')
      return rs.pipe(createGzip())
    }
  }
}

route.js 引用compress

Node4-5静态资源服务器实战以及优化压缩文件实例内容

运行结果

Node4-5静态资源服务器实战以及优化压缩文件实例内容

Node4-5静态资源服务器实战以及优化压缩文件实例内容

如果把相关压缩的代码注释掉

Node4-5静态资源服务器实战以及优化压缩文件实例内容

Node4-5静态资源服务器实战以及优化压缩文件实例内容

 

以上就是Node4-5静态资源服务器实战_优化压缩文件的全部知识点内容,感谢大家的阅读和对三水点靠木的支持。

Javascript 相关文章推荐
菜单效果
Oct 14 Javascript
动态样式类封装JS代码
Sep 02 Javascript
通过$(this)使用jQuery包装后的方法或属性
May 18 Javascript
QQ空间顶部折页撕开效果示例代码
Jun 15 Javascript
Iframe实现跨浏览器自适应高度解决方法
Sep 02 Javascript
js实现数字每三位加逗号的方法
Feb 05 Javascript
js图片轮播手动切换效果
Nov 10 Javascript
JS实现DIV容器赋值的方法
Dec 14 Javascript
AngularJS 中的Promise --- $q服务详解
Sep 14 Javascript
JavaScript表单验证实现代码
May 22 Javascript
理解 Node.js 事件驱动机制的原理
Aug 16 Javascript
webpack开发环境和生产环境的深入理解
Nov 08 Javascript
webpack + vue 打包生成公共配置文件(域名) 方便动态修改
Aug 29 #Javascript
微信小程序实现购物车代码实例详解
Aug 29 #Javascript
vue图片加载失败时用默认图片替换的方法
Aug 29 #Javascript
vue 框架下自定义滚动条(easyscroll)实现方法
Aug 29 #Javascript
Angular8路由守卫原理和使用方法
Aug 29 #Javascript
Vue中的循环及修改差值表达式的方法
Aug 29 #Javascript
vue父子组件通信的高级用法示例
Aug 29 #Javascript
You might like
色色整理的PHP面试题集锦
2012/03/08 PHP
将CMYK颜色值和RGB颜色相互转换的PHP代码
2014/07/28 PHP
php将textarea数据提交到mysql出现很多空格的解决方法
2014/12/19 PHP
PDO防注入原理分析以及注意事项
2015/02/25 PHP
PC端微信扫码支付成功之后自动跳转php版代码
2017/07/07 PHP
使用vs code编辑调试php配置的方法
2019/01/29 PHP
PHP多进程通信-消息队列使用
2019/03/08 PHP
基于jQuery实现拖拽图标到回收站并删除功能
2015/11/25 Javascript
jQuery Validation PlugIn的使用方法详解
2015/12/18 Javascript
AngularJS模块学习之Anchor Scroll
2016/01/19 Javascript
Bootstrap项目实战之首页内容介绍(全)
2016/04/25 Javascript
AngularJS 中使用Swiper制作滚动图不能滑动的解决方法
2016/11/15 Javascript
基于Vue的文字跑马灯组件(npm 组件包)
2017/05/24 Javascript
Vue2路由动画效果的实现代码
2017/07/10 Javascript
js实现数组内数据的上移和下移的实例
2017/11/14 Javascript
Vuex 单状态库与多模块状态库详解
2018/12/11 Javascript
jQuery实现条件搜索查询、实时取值及升降序排序的方法分析
2019/05/04 jQuery
layui表格内容溢出的解决方法
2019/09/06 Javascript
公众号SVG动画交互实战代码
2020/05/31 Javascript
vue.js实现h5机器人聊天(测试版)
2020/07/16 Javascript
JavaScript事件循环及宏任务微任务原理解析
2020/09/02 Javascript
Vue实现鼠标经过文字显示悬浮框效果的示例代码
2020/10/14 Javascript
[02:19]DOTA2女子战队FOX视频专访:希望更多美眉一起加入
2013/10/15 DOTA
[01:19:46]DOTA2-DPC中国联赛 正赛 SAG vs DLG BO3 第一场 2月28日
2021/03/11 DOTA
Python中使用asyncio 封装文件读写
2016/09/11 Python
mac下给python3安装requests库和scrapy库的实例
2018/06/13 Python
django的csrf实现过程详解
2019/07/26 Python
利用Python产生加密表和解密表的实现方法
2019/10/15 Python
解决pycharm启动后总是不停的updating indices...indexing的问题
2019/11/27 Python
python shapely.geometry.polygon任意两个四边形的IOU计算实例
2020/04/12 Python
印度最好的在线药品订购网站:PharmEasy
2018/11/30 全球购物
委托书的格式
2014/08/01 职场文书
七夕活动策划方案
2014/08/16 职场文书
财务个人年度总结范文
2015/02/26 职场文书
教师岗位职责范本
2015/04/02 职场文书
导游词之广东佛山(南风古灶)
2019/09/24 职场文书