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 相关文章推荐
jquery实现textarea输入框限制字数的方法
Jan 15 Javascript
js数组去重的5种算法实现
Nov 04 Javascript
jquery基础知识第一讲之认识jquery
Mar 17 Javascript
20分钟打造属于你的Bootstrap站点
Jul 27 Javascript
jQuery插件jqGrid动态获取列和列字段的方法
Mar 03 Javascript
微信小程序手势操作之单触摸点与多触摸点
Mar 10 Javascript
jQuery EasyUI tree增加搜索功能的实现方法
Apr 27 jQuery
Angular X中使用ngrx的方法详解(附源码)
Jul 10 Javascript
Angular6中使用Swiper的方法示例
Jul 09 Javascript
解决百度Echarts图表坐标轴越界的方法
Oct 17 Javascript
详解JavaScript栈内存与堆内存
Apr 04 Javascript
Javascript Web Worker使用过程解析
Mar 16 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中的日期处理方法集锦
2007/01/02 PHP
PHP缓冲区用法总结
2016/02/14 PHP
Yii框架连接mongodb数据库的代码
2016/07/27 PHP
php将文件夹打包成zip文件的简单实现方法
2016/10/04 PHP
用javascript控制iframe滚动的代码
2007/04/10 Javascript
JQUERY 对象与DOM对象之两者相互间的转换
2009/04/27 Javascript
innerhtml用法 innertext用法 以及innerHTML与innertext的区别
2009/10/26 Javascript
JQuery的Validation插件中Remote验证的中文问题
2010/07/26 Javascript
JQUERY1.6 使用方法四 检测浏览器
2011/11/23 Javascript
原生JavaScript实现滚动条效果
2020/03/24 Javascript
jquery实现轮播图效果
2017/02/13 Javascript
详解刷新页面vuex数据不消失和不跳转页面的解决
2018/01/30 Javascript
jquery实现动态添加附件功能
2018/10/23 jQuery
微信公众号平台接口开发 获取access_token过程解析
2019/08/14 Javascript
layui实现下拉复选功能的例子(包括数据的回显与上传)
2019/09/24 Javascript
Angular6项目打包优化的实现方法
2019/12/15 Javascript
JavaScript计算出两个数的差值
2020/03/19 Javascript
javascript设计模式 ? 原型模式原理与应用实例分析
2020/04/10 Javascript
在vue中使用Base64转码的案例
2020/08/07 Javascript
[02:06]DOTA2肉山黑名单魔法终结者 敌法师中文配音鉴赏
2013/06/17 DOTA
pycharm 使用心得(一)安装和首次使用
2014/06/05 Python
Python实现从url中提取域名的几种方法
2014/09/26 Python
python3.4爬虫demo
2019/01/22 Python
Python时间差中seconds和total_seconds的区别详解
2019/12/26 Python
django中的数据库迁移的实现
2020/03/16 Python
pyqt5 textEdit、lineEdit操作的示例代码
2020/08/12 Python
Python常用外部指令执行代码实例
2020/11/05 Python
Django数据模型中on_delete使用详解
2020/11/30 Python
英国第一独立滑雪板商店:The Snowboard Asylum
2020/01/16 全球购物
股权收购意向书
2014/04/01 职场文书
团支书竞选演讲稿
2014/04/28 职场文书
节能环保家庭事迹材料
2014/08/27 职场文书
技术股份合作协议书
2014/10/05 职场文书
2015年妇产科工作总结
2015/05/18 职场文书
法院执行局工作总结
2015/08/11 职场文书
vue判断按钮是否可以点击
2022/04/09 Vue.js