Ajax请求如何避免缓存问题

简介: 当Ajax第一次发送请求后,会把请求的URL和返回的响应结果保存在缓存内,当下一次调用Ajax发送相同的请求时(URL完全相同,参数完全相同),浏览器就不会与服务器交互,而是直接从缓存中把数据取出来,这是为了提高页面的响应速度和用户体验,(服务端也会收到请求响应304)。
  • 一、为什么会有缓存问题

1、当Ajax第一次发送请求后,会把请求的URL和返回的响应结果保存在缓存内,当下一次调用Ajax发送相同的请求时(URL完全相同,参数完全相同),浏览器就不会与服务器交互,而是直接从缓存中把数据取出来,这是为了提高页面的响应速度和用户体验,(服务端也会收到请求响应304)。

2、浏览器会自作主张的把所有异步请求来的文件缓存,当下一次请求的URL和之前的一样,那么浏览器将不会发送这个请求,而是直接把缓存的内容当做xhr.responseText。

注意:post 请求方式不会被缓存,只有 get 请求方式才会被缓存。

  • 二、、如何避免缓存问题

1、随机数

// 获取随机数
var data = Math.random().toString().substring(2);

在我们发送Ajax请求的时候,在URL地址后面加上随机数当作参数传递的时候,就会被客户端认为是不同的请求,这时候就会去请求服务端,获取新的数据。

2、时间戳

// 获取当前时间戳
var data = Date.now();

其实和上面第一种方法差不多了,也就是在URL地址后面加上当前的时间戳作为参数传递,客户端就会认为是不同的请求,这时候就会去请求服务端,获取新的数据。

  • 其实两次实现的方法都差不多了,思想就是,既然不能改变Ajax请求的URL路径,那就通过将get请求的参数做成每次都不一样,这样就不会被浏览器缓存了
目录
相关文章
|
19天前
|
JSON 前端开发 JavaScript
axios请求成功而$.ajax却不行排错
axios请求成功而$.ajax却不行排错
13 2
|
1月前
|
前端开发
解决前端ajax跨域请求不携带cookie信息JSESSIONID的问题
解决前端ajax跨域请求不携带cookie信息JSESSIONID的问题
|
4月前
|
XML JSON 前端开发
Ajax技术【Ajax技术详解、 Ajax 的使用、Ajax请求、 JSON详解、JACKSON 的使用 】(一)-全面详解(学习总结---从入门到深化)
Ajax技术【Ajax技术详解、 Ajax 的使用、Ajax请求、 JSON详解、JACKSON 的使用 】(一)-全面详解(学习总结---从入门到深化)
60 1
|
2天前
|
缓存 JavaScript CDN
一次js请求一般情况下有哪些地方会有缓存处理?
一次js请求一般情况下有哪些地方会有缓存处理?
4 0
|
9天前
|
XML JSON 前端开发
学习Ajax使用异步对象发送请求
Ajax,全称Asynchronous JavaScript and XML(异步JavaScript和XML),是一种用于创建更好、更快以及交互性更强的Web应用程序的技术。
17 3
|
2月前
|
缓存 JavaScript 前端开发
一次js请求一般情况下有哪些地方会有缓存处理?
一次js请求一般情况下有哪些地方会有缓存处理?
19 1
|
2月前
|
前端开发
AJAX发送请求方法封装和请求函数底层刨析以及axios二次封装
AJAX发送请求方法封装和请求函数底层刨析以及axios二次封装
|
3月前
|
缓存 JavaScript CDN
一次js请求一般情况下有哪些地方会有缓存处理?
一次js请求一般情况下有哪些地方会有缓存处理?
|
4月前
|
XML JSON 前端开发
|
4月前
|
前端开发 JavaScript