介绍

平时我去学习Http应用层协议的时候，对于Http的结构和请求头字段的作用方面掌握了一些知识点，但是没有系统化解决一些问题，所以导致理解不深，最近遇到面试题，正好反思下Http缓存什么情况请求服务器，什么情况下直接使用浏览器缓存。

例子

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    </head>
    <body>
        <img src="images/head.png" />
        <a href="page.html">重新访问page页</a>
    </body>
</html>

第一次请求：

first request.png
说明：
第一次浏览器发送请求到服务器，发送请求头 Cache-Control字段为no-cache，no-cache会将数据缓存到本地，但是下次会强制向服务器发起验证。服务器向客户端返回最后修改时间Last-modified和服务器资源标识ETag（服务器会为每个资源都分配一个ETag，作为唯一标识，如果资源发生一些细微修改，就会加上W/"......."）。因为第一次请求没有访问浏览器的本地缓存，所以返回响应状态码为200，然后将当前的资源缓存到浏览器本地。

第二次请求：

second request.png

说明：
第二次浏览器发送请求到服务器，不是直接去请求资源，而是验证当前浏览器的缓存是否有效。服务器主要比对的请求头字段是If-Modified-Since判断最后修改时间是否匹配和请求头字段If-None-Match指定当前的资源。
如果发现字段If-None-Match指定的资源判断字段If-Modified-Since时间大于最后修改时间，那么就从服务器上将资源重新返回响应码为200，如果小于等于最后修改时间，说明资源没有发生修改，那么就直接使用浏览器本地缓存，返回响应码为304。