ajax緩存問題
阿新 • • 發佈：2018-01-31
數據不一致 ade 後臺 nco con 前臺 gettime sta 優先
今天在做一個需求的時候，發現在IE下面通過AJAX獲取到的數據和服務器裏面的數據不一致，最開始我以為是數據庫連接工具的事物沒有提交，但是當我提交事物以後，這個問題照樣繼續，然後我打開IE的開發者工具，將這個AJAX的請求捕獲，發現在IE下面他從緩存中獲取了數據，沒有發起新的請求。
原因
使用GET方法時，如果請求參數相同，則瀏覽器會認為是同一個請求並且請求結果是一樣的，所以存在緩存那麽瀏覽器就優先返回緩存的結果，使用POST則不會出現這種情況。
解決方法：
- 使用
POST方法。 在請求參數的後面加一個隨機數或者時間戳。
var url = "/webtest/Data.jsp?t=" + newDate().getTime();後臺的響應設置緩存控制的響應頭。對於jsp或者servlet設置如下。
response.setHeader("Cache-Control", "no-cache,no-store");
4.在使用jQUery下使用jQuery.ajax( url [, settings ]),設置cache參數為false。
5.其他方法待續。
測試用JSP代碼
測試用前臺頁面
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <html> <body> <h2>Hello World!</h2> <script type="text/javascript" src="/webtest/static/jquery.min.js"></script> <button id="btn">獲取數據</button> <hr> <h2 id="show"></h2> </body> <script type="text/javascript"> $(function() { $("#btn").click(function() { var url = "/webtest/Data.jsp?"; $.get(url, function(res) { $("#show").text(JSON.stringify(res)); }, ‘json‘); }); }); </script> </html>
返回數據頁面
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <% response.setContentType("application/json"); String data = "300"; String name = "oops"; String json = "{\"name\"" + ":\"" + name + "\"" + ",\"data\"" + ":" + data + "}"; out.write(json); %>
ajax緩存問題