在现代web APP应用中，前端代码充满了大量的Ajax请求。 如果可以对Ajax请求使用浏览器缓存，则可以大大减少网络请求并提高程序响应速度。
1.Ajax请求
通过使用jQuery框架，可以轻松地发出Ajax请求。 示例代码如下：
1$.Ajax({ ()
2 url : 'url '，
3 dataType : 'xml '，
4高速缓存：真，
5 success :功能(XML，status ) {
6 }
7 )；
非常简单。 请注意其中第四行的代码： cache:true。 如果当前请求具有缓存，则显式请求将直接使用缓存。 如果此属性设置为false，则每次都会向服务器请求。 Jquery的注释如下：
If set to false，itwillforcerequestedpagesnottobecachedbythebrowser.settingcachetofalsealsoappendsaquerystringparameter，' _ _
前端工作也只有这些，那么Ajax请求是否可以使用浏览器缓存？
继续看。
2. Http协议
Http协议的header部分定义了客户端是否应该执行Cache以及如何执行Cache。 有关详细信息，请参阅Http Header Field Definitions中的14.9缓存控制和14.21 Expires。 现在我简单地说：
缓存控制
缓存控制用于控制HTTP缓存。 (HTTP/1.0可能没有实现某些功能，仅实现了Pragma: no-cache。 ）
包中的格式：
高速缓存控制：高速缓存定向
cache-directive包括：
对于请求：
| 'no-cache '
| 'no-store '
| 'max-age' '=' delta-seconds
| 'max-stale' [ '=' delta-seconds ]
| '最小- fresh ' '=' delta-seconds
| 'no-transform '
| 'only-if-cached '
| 'cache-extension '
对于响应：
| '公共'
| '私有' [ '=' field-name ]
| 'no-cache' [ '=' field-name ]
| 'no-store '
| 'no-transform '
| 'must-revalidate '
| 'proxy-revalidate '
| 'max-age' '=' delta-seconds
| 's-maxage' '=' delta-seconds
| 'cache-extension '
说明：
-Public表示响应可以缓存在任意缓存中。
-Private表示共享缓存未处理针对单个用户的全部或部分响应消息。 这样，服务只能描述用户的部分响应消息。 此响应消息对其他用户的请求无效。
-no-cache表示无法缓存请求或响应消息。 (HTTP/1.0将替换为Pragma中的无缓存。 ）
-no-store用于防止重要信息意外公开。 在请求消息中发送时，请求消息和响应消息都不再使用缓存。
-max-age表示客户端可以接收小于或等于指定时间(秒)的生存期响应。
-min-fresh表示客户端可以接收的响应少于当前时间加上指定时间的时间。
-max-stale表示客户端可以接收超过超时期限的响应消息。 指定max-stale消息的值后，客户端可以执行以下操作
接收超过指定超时值的响应消息。
高速列车
Expires表示Cache的有效时间，允许客户端在此时间之前不发送请求，与max-age的效果相同。 但是，如果同时存在，则会被缓存控制的max-age覆盖。
格式： expires=' expires ' ' : ' http-date
示例： Expires: Thu，01 Dec 1994 16:00:00 GMT
最后修改
Last-Modified以GMT格式显示上次修改文档的时间，并在客户端第二次请求此URL时向标题添加属性，询问是否在该时间之后修改了文件。 如果服务器端文件未更改，则状态返回304，内容为空，从而节省传输数据量。
3 .问题
在运行Web前端时，我们发现客户端Ajax每次都从服务器端请求数据，但这些数据的即时性不是很高，不需要每次都请求。
明确地在Ajax中将cache添加到true后，发现问题仍然存在。 因此，服务端的问题受到怀疑，服务端使用jersey构建了基于rest风格的服务。 代码片段如下：
@GET
@ produces (应用程序/XML ) )。
公共响应获取产品(
response.responsebuilderresponse=response.ok (数据；
return response.build
}
添加Cache控件后进行测试，一切都OK。
最后一个代码是：
@GET
@ produces (应用程序/XML ) )。
公共响应获取产品(
response.responsebuilderresponse=response.ok (数据；
//expires3secondsfromnow . thiswouldbeideallybased
//ofsomepre-determined non-functional requirement。
dateexpirationdate=new date (system.current time millis () ) 3000；
response.expires (expiration date；
return response.build
}
以上是示例代码，通过使用CacheControl、Last-Modified等，还可以进行更精细的控制。
最后一次
“我相信有很多想学习前端的伙伴。 今年年初，我花了一个月整理了最适合2018年学习的网络前端干货。 从最基础的HTML CSS JS到移动端的HTML5，我们整理了各种框架，并将其发送给了所有前端伙伴。 53763
1707这里是急需的仙人掌聚会，欢迎初学者和正在步进的伙伴。 ”