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 相关文章推荐
理解JavaScript的caller,callee,call,apply
Apr 28 Javascript
jQuery UI Dialog 创建友好的弹出对话框实现代码
Apr 12 Javascript
JavaScript高级程序设计(第3版)学习笔记11 内建js对象
Oct 11 Javascript
JavaScript实现继承的4种方法总结
Oct 16 Javascript
JavaScript中的值类型转换介绍
Dec 31 Javascript
jQuery实用技巧必备(上)
Nov 02 Javascript
【经验总结】编写JavaScript代码时应遵循的14条规律
Jun 20 Javascript
js实现小窗口拖拽效果
Dec 03 Javascript
jQuery实现浏览器之间跳转并传递参数功能【支持中文字符】
Mar 28 jQuery
基于vue-ssr的静态网站生成器VuePress 初体验
Apr 17 Javascript
jQuery点击页面其他部分隐藏下拉菜单功能
Nov 27 jQuery
JS简易计算器实例讲解
Jun 30 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使用正则表达式提取字符串中尖括号、小括号、中括号、大括号中的字符串
2020/04/05 PHP
PHP删除数组中空值的方法介绍
2014/04/14 PHP
2014年最新推荐的10款 PHP 开发框架
2014/08/01 PHP
php输出xml必须header的解决方法
2014/10/17 PHP
Ubuntu中启用php的mail()函数并解决发送邮件速度慢问题
2015/03/27 PHP
PHP使用自定义方法实现数组合并示例
2016/07/07 PHP
laravel使用数据库测试注意事项
2020/04/10 PHP
JavaScript获取GridView选择的行内容
2009/04/14 Javascript
firefox下jQuery UI Autocomplete 1.8.*中文输入修正方法
2012/09/19 Javascript
js函数中onmousedown和onclick的区别和联系探讨
2013/05/19 Javascript
jQuery(js)获取文字宽度(显示长度)示例代码
2013/12/31 Javascript
使用focus方法让光标默认停留在INPUT框
2014/07/29 Javascript
js验证真实姓名与身份证号,手机号的简单实例
2016/07/18 Javascript
在JavaScript中调用Java类和接口的方法
2016/09/07 Javascript
AngularJS深入探讨scope,继承结构,事件系统和生命周期
2016/11/02 Javascript
Angular项目中$scope.$apply()方法的使用详解
2017/07/26 Javascript
vue中使用localstorage来存储页面信息
2017/11/04 Javascript
vuejs移动端实现div拖拽移动
2019/07/25 Javascript
Vue时间轴 vue-light-timeline的用法说明
2020/10/29 Javascript
Python的__builtin__模块中的一些要点知识
2015/05/02 Python
基于hashlib模块--加密(详解)
2017/06/21 Python
Python 基础教程之闭包的使用方法
2017/09/29 Python
Odoo中如何生成唯一不重复的序列号详解
2018/02/10 Python
利用Python半自动化生成Nessus报告的方法
2019/03/19 Python
Python pandas实现excel工作表合并功能详解
2019/08/29 Python
python groupby 函数 as_index详解
2019/12/16 Python
Python GUI库PyQt5样式QSS子控件介绍
2020/02/25 Python
python里反向传播算法详解
2020/11/22 Python
如何用python写个模板引擎
2021/01/14 Python
HealthElement海外旗舰店:新西兰大卖场
2018/02/23 全球购物
毕业生自荐信的主要内容
2013/10/29 职场文书
2014迎国庆演讲稿
2014/09/19 职场文书
村党支部对照检查材料思想汇报
2014/09/28 职场文书
小学运动会宣传稿
2015/07/23 职场文书
幼儿园教师暑期培训心得体会
2016/01/09 职场文书
详解TypeScript的基础类型
2022/02/18 Javascript