浏览器缓存

Apache网页优化之缓存 文章目录 一、Apache的网页缓存 二、网页缓存配置 一、Apache的网页缓存 Apache 的mod_expries 模块会自动生成页面头部信息中的 Express标签和 Cache-Control 标签。 客户端浏览器根据标签决定下次访问是在本地机器的缓存中获取页面，不需要再次向服务器发出请求，从而降低客户端的访问频率和次数，达到减少不必要的流量和增加访问速度的目的。 二、网页缓存配置 1、挂载共享文件，并解压到 /opt/目录下。 安装包优化，转移到http-2.4.2下面 2、安装编译工具 3、在 /opt/httpd-2.4.2 配置 4、make && make install 5、打开Apache的主配置文件，开启 expires 模块 修改域名和监听地址 开启expires模块 在文件末尾添加 验证apachen甚至是否成功 6、开启apache服务，关闭防火墙，并验证模块开启 win10验证： 在win10系统 安装抓包工具Fiddler。打开 Fiddler4，同时用浏览器输入IP地址：192.168.220.137，访问测试网站 如果不要缓存时间这么长， 可以在主配置文件中 我们自己在末尾添加的那段命令中 ，把50 修改成自己要的时间。 来源： 51CTO 作者： wx5d8a05337d6b9 链接： https://blog

常用方法 压缩源码和图片 　　JavaScript文件源代码：可以采用混淆压缩的方式，CSS文件源代码进行普通压缩，JPG图片可以根据具体质量来压缩为50%到70%，PNG可 以使用一些开源压缩软件来压缩，比如24色变成8色、去掉一些PNG格式信息等。 　　选择合适的图片格式：如果图片颜色数较多就使用JPG格式，如果图片颜色数较少就使用PNG格式，如果能够通过服务器端判断浏览器支持WebP，那么就使用WebP格式和 SVG格式。 合并静态资源 　　包括CSS、JavaScript和小图片，减少HTTP请求。 开启服务器端的Gzip压缩 　　这对文本资源非常有效，对图片资源则没那么大的压缩比率。 使用CDN 或者一些公开库使用第三方提供的静态资源地址 　　 比如jQuery、normalize.css。一方面增加并发下载量，另一方面能够和其他网站共享缓存。 延长静态资源缓存时间 　　频繁访问网站的访客就能够更快地访问。不过，这里要通过修改文件名的方式，确保在资源更新的时候，用户会拉取到最新的内容。 CSS引用放在页面头部，JavaScript引用放在页面底部 　　这样就不会阻塞页面渲染，让页面出现长时间的空白。 前端工程师的性能优化 基本优化方法是： 尽量减少同一域下的HTTP请求数 以及尽量减少每一个资源的体积 　　浏览器常常限定了对同一域名发起的并发连接数的上限。E6

缓存作为常用的优化手段，是架构师必备技能之一，在面试时我也喜欢让候选人系统的介绍一下缓存知识，能把缓存体系说清楚的并不多。 单机硬件角度缓存 下图是经典的计算机组成原理的缓存结构图 速度从高到低依次是：L1 > L2 > L3 > 内存 > 磁盘(硬盘缓存+硬盘) 单位容量制造成本从高到低依次是：L1 > L2 > L3 > 内存 > 磁盘(硬盘缓存+硬盘) 对硬件来说，缓存是基于有限的成本下，介于相对高速和相对低速设备之间的缓冲，目的是尽可能的提升处理效率。 用户角度看缓存 DNS缓存 对终端用户而言，操作系统和浏览器都存在着DNS缓存 CDN CDN不是缓存，其核心思想是将用户的请求导向离用户最近的服务节点上，提高用户访问网站的响应速度。只是这里说的最近的服务节点一般是容量有限的缓存服务器。 浏览器缓存 最典型流程是浏览器第一次访问时，服务器返回当前时间Last-Modified值，记为t，当下一次访问时，If-Modified-Since取值t，配合Cache-Control，如果服务端资源未被修改，返回状态码304，浏览器直接从本地磁盘取缓存的网页文件。 对用户来说，缓存是为了从最近的地方取得所需内容，玩命减少等待时间，提升响应速度。 架构角度看缓存 接入层缓存：Nginx缓存 进程内缓存：JVM堆内缓存、堆外缓存 主机内缓存：Local Redis、本地磁盘

Http头介绍:Expires,Cache-Control,Last-Modified,ETag 缓存分很多种：服务器缓存，第三方缓存，浏览器缓存等。其中浏览器缓存是代价最小的，因为浏览器缓存依赖的是客户 端，而几乎不耗费服务器端的资源。 让浏览器做缓存需要给浏览器发送指定的Http头，告诉浏览器缓存多长时间，或者坚决不要缓存。 1.Expires（过期时间） HTTP头信息Expires（过期时间） 属性是HTTP控制缓存的基本手段，这个属性告诉缓存器：相关副本在多长时间内是新鲜的。过了这个时间，缓存器就会向源服务器发送请求，检查文档是否被修改。几乎所有的缓存服务器都支持Expires（过期时间）属性； 大部分Web服务器支持你用几种方式设置Expires属性；一般 的：可以设计一个绝对时间间隔： 基于客户最后查看副本的时间（最后访问时间）或者根据服务器上文档最后被修改的时间； Expires 头信息：对于设置静态图片文件（例如导航栏和图片按钮）可缓存特别有用；因为这些图片修改很少，你可以给它们设置一个特别长的过期时间，这会使你的网站对 用户变得相应非常快；他们对于控制有规律改变的网页也很有用，例如：你每天早上6点更新新闻页，你可以设置副本的过期时间也是这个时间，这样缓存 服务器就知道什么时候去取一个更新版本，而不必让用户去按浏览器的“刷新”按钮。

原文地址:http://small.aiweimeng.top/index.php/archives/58.html 先来一张图: #### 下面简单的来描述一下HTTP Cache机制 ： 当资源资源第一次被访问的时候，http status返回200，在头部携带当前资源的描述信息，eg: 最后修改的时间:```Last-Modified``` 资源状态唯一标识:```Etag``` 资源在客户端缓存的过期时间:```Expires``` 同时浏览器会将资源缓存到cache目录，并保存文件描述信息。 当客户端第二次请求资源时，会先检查cache目录中是否含有该资源，如果有，并且还没到Expires设置的时间， 即文件还没有过期，那么此时客户端将直接从Cache目录中读取文件，而不再发送请求 如果资源已经过期，客户端会发送一次http请求到服务器，同时在header携带上次修改的时间： ```text If-Modified-Since Thu, 26 Nov 2009 13:50:19 GMT If-None-Match "8fb8b-14-4794674acdcc0" ``` #### 为什么会返回上一次的信息呢？ web服务器在接收到请求时，会先解析header里面的信息，然后校验头部信息。 如果该资源文件从上次时间到现在都没有修改或者Etag信息没有变化，

应用层上的协议非常重要的一个协议是HTTP协议。 这个协议包括了请求和回复两种报文类型。 请求和回复报文的内容形式是 1）起始行 2）首行 3）消息体 请求报文的内容格式是 <version><request-url><method> <headers> <entity-body> 回复报文的内容格式是 <version><status><reason-pharse> <headers> <entity-body> 报文中标签代表的含义是 method:指请求方法，主要的方法为GET和POST。 request-url:指请求路径/地址 version:指协议版本，现在通常是http/1.1　　 status:指响应状态码，主要的响应状态例如200,404。 reason-pharse:原因短语，200 Ok、404 No Found 这种后面描述的就是原因短语，不必太过关注。 method 请求方法使用频繁的是Get和POST。面试的时候通常被问到这两个方法有什么区别。这里我们来谈一谈。 GET和POST在传输形式上有一些差异。GET请求时，会在request-url地址后拼接参数，格式是url？parm1=ss&parm2=dd。 所以，这样的形式会在地址栏中暴露参数。由于url地址采用ASCII编码，如果参数中有Unicode编码的字符，例如汉字，需要转码后传输。

阿里P7移动互联网架构师进阶视频（每日更新中）免费学习请点击： https://space.bilibili.com/474380680 本篇文章将继续从以下两个内容来解析OkHttp3源码: [HTTP重定向] [缓存的处理] 一、HTTP重定向 1.1 重定向 重定向(Redirect)就是通过各种方法将各种网络请求重新定个方向转到其它位置（如：网页重定向、域名的重定向、路由选择的变化也是对数据报文经由路径的一种重定向）。 ----百度百科 1.2 原理 在 HTTP 协议中，重定向操作由服务器通过发送特殊的响应（即 redirects）而触发。HTTP 协议的重定向响应的状态码为 3xx 。浏览器在接收到重定向响应的时候，会采用该响应提供的新的 URL ，并立即进行加载；大多数情况下，除了会有一小部分性能损失之外，重定向操作对于用户来说是不可见的。 ​ image 不同类型的重定向映射可以划分为三个类别：永久重定向、临时重定向和特殊重定向。 1.3 永久重定向 这种重定向操作是永久性的。它表示原 URL 不应再被使用，而应该优先选用新的 URL。搜索引擎机器人会在遇到该状态码时触发更新操作，在其索引库中修改与该资源相关的 URL 。 注意了：浏览器自动重定向，不管代码怎么写都会自动重定向到第一次你永久重定向的URL，没办法，这时候你只能清楚浏览器缓存 编码 含义 处理方法

时间2015年的某个周六凌晨5点，公司官方的QQ群有用户反馈官网打不开了，但有的用户反馈可以打开，客服爬起来自己用电脑试了一下没有问题，就给客户反馈说，可能是自己网络的问题，请过会在试试。早点8点，越来越多的用户反馈官网无法打开，并且有部分用户开发反馈app也打不开了，客服打电话叫起了还在梦乡中的我。 分析定位 被客服叫起来之后，一脸懵逼，不知道什么情况，给客服回复，知道了，立刻排查，待会有消息及时沟通。用凉水洗了一把脸清醒了一下，立刻根据经验回忆这两天生产投产的情况：上线了XX模块，不影响、修复了XXbug，应该也不影响、刚给服务器配置了https，看起来好像有点关系，但是app暂时没有投产https，怎么也出现问题，排除之。打开电脑核查了最近的投产记录应该都不至于发生这么严重的问题，随怀疑是不是网络方面有问题，立刻打电话叫起来运维经理以及相关人等一起排查。 一边让网络和运维排除问题，一边再次核查了web服务器、数据库服务器、业务日志、数据库日志，以及其它的一些监控数据，各项皆正常。试着在本机ping了一下域名确实不通，更加怀疑是网络问题，尝试这直接使用外网访问官，可以打开没有问题，可以基本确认服务没有问题，但运维部反馈网络设备什么都正常，肯定是你们投产代码出问题了，各方硬着头皮继续在排查。 9点，群里开始有大规模的用户反馈官网和app都打不开了，更有部分用户煽动

【一】AJAX+ML+DTD概念 　　 【二】 【三】 【四】 【五】 【六】 【七】 场景： 同步异步： AJAX大部分操作都是异步 状态： 读取状态&&HTTP状态码 相关属性： 封装： 拓展注意： XML缺点：老版数据类型，同等数据量的情况下，XML文件要比JSON格式文件大出很多.. .. 缓存机制：根据URL进行缓存的，如果URL不变，则会一直缓存。 eval作用：将字符串里内容解析为JS可以识别的代码， 本质区别： 表现区别： GET后传输数据限制，容量小，本质浏览器对URL的限制（4-10K），不适合传输大数据 POST传输数据容量大，2G左右 如果想真正安全，需要走https安全传输协议 主要区别： . 来源： https://www.cnblogs.com/jianxian/p/12099913.html

B/S网络架构 随着Web2.0时代的到来，互联网的网络架构已经从传统的C/S架构转变到更加方便快捷的B/S架构。这样的转化简化了人们上网的方式，也加速了互联网行业的发展。 B/S架构的好处： 1.客户端使用统一的浏览器（Browser）。因为浏览器是统一的，所以用户的使用难度大大的降低了，而且对于开发者来说也可以降低学习成本。 2.服务端（Server）基于统一的HTTP协议。HTTP是一种无状态的连接，请求完成后断开。全世界的互联网服务都基于统一打招呼的方式，这种方式更加便捷，效率更高。 当用户输入www.taobao.com的时候这个URL的时候，将会发生很多的操作。首先它会请求DNS把这个域名解析成对应的IP地址，然后根据z合格IP地址在互联网上找到对应的服务器，向这个服务器发一个get请求，由这个服务器决定返回默认的数据资源给访问的用户。服务器也可以是有很多台，到底指定哪台服务器来处理请求，这需要一个负载均衡设备来平均分配所有用户的请求；还有请求的数据是存储在分布式缓存里还是一个静态文件中，或是在数据库里；当数据返回浏览器时,浏览器解析数据发现还有一些静态资源文件（如css、js或者图片）时又会发起另外的HTTP请求，而这些请求很可能会在CDN上，那么CDN服务器又会处理这个用户的请求，用户发起一个请求大概有这么多的过程，如果有哪个节点出现了问题