小话浏览器缓存

最近在参加的一个项目，主要是web相关的产品，经常出现开发更完包之后，验证一些功能出现异常，但是一到别人电脑上又不复现，每次都让清理浏览器缓存。测试的时候可以这么清，到了客户那，客户愿意一直清吗？故尝试了解背后原因。

现象：怎么刷新都不行，必须清理浏览器才能查看提交的数据。

分析过程

1）问题发现后，按照刚才的操作仍然可以复现，有必现步骤的

2）观察日志打印，——这一步暂时因为某些原因没有做

3）删除配置后，发现数据库中的数据也成功删除了，但是重新添加时，仍存在校验提示配置已存在。——这一步也没做

4）数据库操作没有问题，于是合理怀疑页面的配置校验读取了缓存，而没有实时的读取数据库信息。

5）清除浏览器缓存，重启浏览器，再次进行添加，添加成功，证实了4中的猜测。

问题原因

页面在新添加配置进行保存时会进行校验，但是校验读取了缓存。导致了删除配置再添加时会失败。

修改方式

最后的修改方式，是在每次请求中添加了时间戳。这样，就不会由于每次请求相同，会读取相同的缓存。既保障了缓存的优势（查询反馈速度快），又避免了缓存造成的读取错误的原因

问题定位的思路

1）大多数情况，问题的原因是后端代码没有处理好，所以问题出现时，首先应该去看日志；

2）确定问题在前端或者后端日志不能定位的情况下，需要配合使用F12工具或者抓包工具辅助定位；

3）问题特别难定位时，可以使用假设-预测-试验-分析的方法推测问题的原因。

关于缓存

在设计阶段，开发采用什么样的缓存机制一般在设计文档中都是没有说明的。测试在开发设计阶段、测试分析阶段、测试阶段，可能对哪些功能会用到缓存，哪些用不到缓存不够敏感，也常常不能分辨。

通过缓存可以降低延迟，加快响应速度，优化性能。如果使用了缓存，需注意是使用了浏览器缓存还是Cache，浏览器缓存可以通过刷新页面来重新访问服务器，而Cache是刷新之后还是读取缓存的。测试过程中，如果遇到刷新页面也不能解决的问题，需要格外注意。

1）浏览器缓存

浏览器的缓存的过程主要分为强制缓存和协商缓存。浏览器主要是通过http报头中的cache-control,expires,last-modified,if-modified-since,etag,if-none-match等字段都来控制缓存的。Cache-control的值为public时，请求返回的内容经过的路径中，包括HTTP代理浏览器、发出请求的浏览器都可以对返回数据进行缓存；Cache-control值为max-age时，则是标识了缓存的有效时间，在到期之前，都会读取缓存不会重复访问服务器；Cache-control为no-cache时，浏览器会缓存内容，但是是否使用缓存由协商缓存决定；no-store则表示所有内容都不会被缓存。在浏览器的缓存机制中，强制缓存要优先于协商缓存，如果强制缓存生效，则直接使用缓存，如果不生效则进行协商缓存，协商缓存由服务器决定给是否要读取缓存，浏览器发送请求到服务器询问资源是否有更新，如果没有更新则继续读取缓存，如果更新了则重新返回资源和缓存标识并存储到缓存中。如果在分析请求时，看到请求头中的相关字段，需要格外注意请求是否读取了缓存。

[if !supportLists]2）[endif]Cache

Cache用于在http请求期间保存页面或者数据，存储于服务器的内存中。通常来说，cache主要用来缓存一些查询的结果来提高响应速度。开发会选择将用户频繁访问的服务器资源存储在cache中，当用户发出相同的请求后，服务器不是再次处理而是将cache中保存的数据直接返回给用户，节省了服务器的处理时间。

其他与缓存同样说的最多的是cookie和session。用户在连接服务器时，会生成唯一的sessionID存储在cookie中,session会依赖cookie，对不支持cookie的浏览器可以用session url的重定向来解决。cookie和session区别是cookie存储的数据有大小限制，且与用户有关，session与会话有关。

3.测试建议

  1）在测试用例设计时，对存在唯一校验的功能应反复操作。像这个缺陷中的类似场景，可以添删除后重新添加相同的数据验证校验时读取的是缓存还是实时读取的后台数据。

  2）如果存在本系统嵌入了其他系统的页面的情况，在本系统中打开其他系统的页面时，需要考虑清除缓存后进行操作。

  3）对列表记录进行修改或者编辑后，列表没有马上刷新，需要手动刷新页面才会更新列表。对于此类问题，可以建议开发在提交修改或者编辑的数据后，再发一个请求获取数据来及时刷新列表数据，提高用户体验。

  4）与缓存或是cookie、session有关的一类问题，测试过程中不能简单的清缓存就可以了，遇到这类问题时除了要多考虑问题的影响还要再多深究原因。

一个小彩蛋：

我有一个大胆的猜想，浏览器缓存应该还和开发设计的请求方式有关系，比如设计的到底是get请求还是post请求呢？为什么每次出问题的都是ie浏览器呢。。。

【原因】IE浏览器上get请求会走浏览器缓存

【方式】加上时间戳，保证浏览器识别为最新的请求，向后端取数据

是不是说谷歌浏览器上不会走浏览器缓存？