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 相关文章推荐
JS上传前预览图片实例
Mar 25 Javascript
js改变鼠标的形状和样式的方法
Mar 31 Javascript
JavaScript实现常用二级省市级联下拉列表的方法
Mar 25 Javascript
jquery实现点击向下展开菜单项(伸缩导航)效果
Aug 22 Javascript
三分钟带你玩转jQuery.noConflict()
Feb 15 Javascript
Google Maps基础及实例解析
Aug 06 Javascript
jQuery+HTML5+CSS3制作支持响应式布局时间轴插件
Aug 10 Javascript
Vue开发过程中遇到的疑惑知识点总结
Jan 20 Javascript
各种选择框jQuery的选中方法(实例讲解)
Jun 27 jQuery
100行代码实现vue表单校验功能(小白自编)
Nov 19 Javascript
vue点击按钮动态创建与删除组件功能
Dec 29 Javascript
JavaScript对象原型链原理解析
Jan 22 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中关于普通表单多文件上传的处理方法
2011/03/25 PHP
php中url传递中文字符,特殊危险字符的解决方法
2013/08/17 PHP
php 强制下载文件实现代码
2013/10/28 PHP
discuz加密解密函数使用方法和中文注释
2014/01/21 PHP
php微信公众开发之获取周边酒店信息的方法
2014/12/22 PHP
PHP读取PPT文件的方法
2015/12/10 PHP
mac下多个php版本快速切换的方法
2016/10/09 PHP
优秀js开源框架-jQuery使用手册(1)
2007/03/10 Javascript
下载网站打开页面后间隔多少时间才显示下载链接地址的代码
2010/04/25 Javascript
jQuery操作input type=radio的实现代码
2012/06/14 Javascript
jquery插件之信息弹出框showInfoDialog(成功/错误/警告/通知/背景遮罩)
2013/01/09 Javascript
js中eval()函数和trim()去掉字符串左右空格应用
2013/02/02 Javascript
js不能获取隐藏的div的宽度只能先显示后获取
2014/09/04 Javascript
浅析Javascript的自动分号插入(ASI)机制
2016/09/29 Javascript
关于Iframe父页面与子页面之间的相互调用
2016/11/22 Javascript
bootstrap侧边栏圆点导航
2017/01/11 Javascript
Nodejs 和 Electron ubuntu下快速安装过程
2018/05/04 NodeJs
使用async await 封装 axios的方法
2018/07/09 Javascript
JavaScript实现像雪花一样的Hexaflake分形
2020/07/07 Javascript
python中__slots__用法实例
2015/06/04 Python
Python查询IP地址归属完整代码
2017/06/21 Python
python利用rsa库做公钥解密的方法教程
2017/12/10 Python
一个月入门Python爬虫学习,轻松爬取大规模数据
2018/01/03 Python
python机器学习之随机森林(七)
2018/03/26 Python
python增加矩阵维度的实例讲解
2018/04/04 Python
tensorflow 获取模型所有参数总和数量的方法
2018/06/14 Python
python循环输出三角形图案的例子
2019/11/22 Python
python 实现二维字典的键值合并等函数
2019/12/06 Python
python利用datetime模块计算程序运行时间问题
2020/02/20 Python
关于 HTML5 的七个传说小结
2012/04/12 HTML / CSS
Ivory Isle Designs美国/加拿大:婚礼和活动文具公司
2018/08/21 全球购物
巴西电子、家电、智能手机购物网站:Girafa
2019/06/04 全球购物
美国优质宠物用品购买网站:Muttropolis
2020/02/17 全球购物
幼儿园安全责任书范本
2014/07/24 职场文书
幼儿园庆六一主持词
2015/06/30 职场文书
2019预备党员转正申请书模板2篇!
2019/08/07 职场文书