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的history历史记录插件
Dec 11 Javascript
jQuery插件实现屏蔽单个元素使用户无法点击
Apr 12 Javascript
jQuery新的事件绑定机制on()示例应用
Jul 18 Javascript
JS中的THIS和WINDOW.EVENT.SRCELEMENT详解
May 25 Javascript
JavaScript绑定事件监听函数的通用方法
May 14 Javascript
浅谈JS使用[ ]来访问对象属性
Sep 21 Javascript
详解Angular的8个主要构造块
Jun 20 Javascript
详解webpack性能优化——DLL
Oct 20 Javascript
SVG实现时钟效果
Jul 17 Javascript
浅谈TypeScript 用 Webpack/ts-node 运行的配置记录
Oct 11 Javascript
AJAX XMLHttpRequest对象创建使用详解
Aug 20 Javascript
基于elementUI竖向表格、和并列的案例
Oct 26 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 Warning: PHP Startup: Unable to load dynamic library \ D:/php5/ext/php_mysqli.dll\
2012/06/17 PHP
PHP内核探索:变量存储与类型使用说明
2014/01/30 PHP
CentOS下PHP安装Oracle扩展
2015/02/15 PHP
微信支付开发动态链接Native支付
2016/07/12 PHP
PHP入门教程之面向对象基本概念实例分析
2016/09/11 PHP
javascript dom追加内容实现示例
2013/09/21 Javascript
js(jQuery)获取时间的方法及常用时间类搜集
2013/10/23 Javascript
javascript如何创建表格(javascript绘制表格的二种方法)
2013/12/10 Javascript
原生js实现淘宝首页点击按钮缓慢回到顶部效果
2014/04/06 Javascript
Windows8下搭建Node.js开发环境教程
2014/09/03 Javascript
js表格排序实例分析(支持int,float,date,string四种数据类型)
2015/05/06 Javascript
XML文件转化成NSData对象的方法
2015/08/12 Javascript
jquery UI Datepicker时间控件的使用方法(基础版)
2015/11/07 Javascript
学习JavaScript设计模式之策略模式
2016/01/12 Javascript
jQuery中DOM节点的删除方法总结(超全面)
2017/01/22 Javascript
canvas实现粒子时钟效果
2017/02/06 Javascript
详解.vue文件中style标签的几个标识符
2018/07/17 Javascript
默认浏览器设置及vue自动打开页面的方法
2018/09/21 Javascript
Layui实现带查询条件的分页
2019/07/27 Javascript
webgl实现物体描边效果的方法介绍
2019/11/27 Javascript
jQuery实时统计输入框字数及限制
2020/06/24 jQuery
浅谈vue 组件中的setInterval方法和window的不同
2020/07/30 Javascript
mapboxgl实现带箭头轨迹线的代码
2021/01/04 Javascript
[51:52]Liquid vs Secret 2019国际邀请赛淘汰赛 败者组 BO3 第二场 8.24
2019/09/10 DOTA
python调用百度语音识别实现大音频文件语音识别功能
2018/08/30 Python
使用python对excle和json互相转换的示例
2018/10/23 Python
python变量的存储原理详解
2019/07/10 Python
Django ORM 聚合查询和分组查询实现详解
2019/08/09 Python
Python创建一个元素都为0的列表实例
2019/11/28 Python
爱尔兰家电数码商城:Currys PC World爱尔兰
2016/07/23 全球购物
NICKIS.com荷兰:设计师儿童时装
2020/01/08 全球购物
对于没有初始化的变量的初始值可以作怎样的假定
2014/10/12 面试题
幼儿园开学家长寄语
2014/01/19 职场文书
大学同学聚会邀请函
2014/01/29 职场文书
校优秀毕业生主要事迹
2014/05/26 职场文书
前台接待员岗位职责
2015/04/15 职场文书