zoukankan      html  css  js  c++  java
  • 强缓存和协商缓存

    http缓存:

    为什么使用缓存:

    当浏览器加载一个页面时html引用的外部资源也会加载,css,js图片等重复加载造成资源浪费而且耗时影响用户体验,http缓存就是为了解决这个问题,将静态资源存储在浏览器,下次请求时重复利用,何时用何时不用需要策略保证,而且资源更新那么缓存也要更新

    缓存的作用:

    提高首屏加载速度,优化用户体验

     减少流量消耗

     减轻服务器压力

    强缓存策略:

     在有效期内,浏览器就用旧的,强缓存离不开两个响应头Expires与Cache-Control, 用其一,同时用的话cache-control优先级更高

    res.setHeader('Expires', new Date(Date.now()+5*1000).toUTCString())
    res.setHeader('Cache-Control','max-age=10')最长10秒

    1、Expires是http1.0提出的一个表示资源过期时间的header,它描述的是一个绝对时间,由服务器返回,Expires 受限于本地时间,如果修改了本地时间,可能会造成缓存失效

    2、Cache-Control 出现于 HTTP / 1.1,优先级高于 Expires ,表示的是相对时间,不依赖客户端的时间

    Cache-Control: public可以被所有用户缓存,包括终端和CDN等中间代理服务器

    Cache-Control: private只能被终端浏览器缓存,不允许中继缓存服务器进行缓存

    Cache-Control: no-cache,先缓存本地,但是在命中缓存之后必须与服务器验证缓存的新鲜度才能使用

    Cache-Control: no-store,不会产生任何缓存

    协商缓存:

     更新逻辑比较复杂,需要问后台,这个时候用

    1Last-modified & if-Modified-Since,通过协商修改时间为基础的策略,if-Modified-Since取自服务器返回的Last-modified

    res.setHeader('last-modified',new Date().toUTCString());
    if(new Date(req.headers['if-modified-since']).getTime()+3*1000 > Date.now()){
          console.log('协商缓存。。。。')
          res.statusCode=304
          res.end()
          return
    }
    

    2、etag & if-none-match,通过内容判断,后台将返回内容进行摘要给前台,下次请求时后台通过对比摘要来判断内容是否更新

    // 协商缓存第二种
    const crypto = require('crypto');
    // 调用sha1算法,更新content,用十六进制编码
    const hash = crypto.createHash('sha1').update(content).digest('hex')
    res.setHeader('Etag',hash);
    if(req.headers['if-none-match'] === hash){
      console.log('协商缓存。。。。')
      res.statusCode=304;
      res.end()
      return
    }
           
    

      

  • 相关阅读:
    flask的简单使用
    Android Studio 使用Lambda表达式
    安卓SDK更新 国内镜像站点记录
    REACT-NATIVE入门(环境搭建及HELLOWORLD)
    深入理解Android 读感(一)
    JNI初入手
    (转)c++ 中的using namespace std是什么意思,什么时候用
    (转)const char to LPCTSTR不能转化问题
    Git常用操作之add操作
    Git日志操作
  • 原文地址:https://www.cnblogs.com/dylAlex/p/13118317.html
Copyright © 2011-2022 走看看