關於AJAX請求伺服器後快取資料,造成沒有及時重新整理的問題

最後更新：2018-12-05 來源：互聯網

上載者：User

創建阿里雲帳戶，並獲得超過 40 款產品的免費試用版；而企業帳戶則可以享有總值 $1200 的免費試用版。立即註冊！

最近在做項目的時候,使用了ajax去請求伺服器的資料!剛開始還可以，我測試一切運行正常（我不是專業的測試人員哈!所以還是有些問題沒有測出來哈）!後來ajax請求的資料變化了,但是頁面資料沒有變，依然是第一次的資料!這個問題害我整了好大半天啊![還是自己技術不到位啊！] 沒辦法遇到問題還是要解決啊!只有硬著頭皮弄了撒! 因為ajax請求也是到後台頁面執行的,那就斷點吧! 嘿嘿，通過斷點我發現了問題! 每次ajax請求他只有第一次去後台，後面的他就不會去後台了!如果你其他按鈕把資料改變了，因為ajax第二次以後都不會去後台執行去資料了!所以資料沒有及時重新整理[資料被緩衝了,如果你重啟IE你修改的資料就可以看到了]，有點希望了! 至少癥狀找到了撒！接下就是怎麼解決這個問題啊! 嘿，後來和Bobby同事提醒我在ajax的請求url後面加一個時間戳記參數試一試! 那就死馬當活馬醫了!反正我也沒有好的方法! 哈哈居然可以了! [在此感謝bobby]（還是自己技術不到位啊！汗…）後來去google了一下，多少人也遇到這個問題! 下面集自己的理解和網路上的一些資源解決這個問題! [IE中如果XMLHttpRequest提交的URL與曆史一樣則使用緩衝，根本不向伺服器端提交。因此無法取到剛提交的資料]

我最初的做法: 下面的代碼運行後! 第一次點擊GetData按鈕顯示 demo , 當在點擊changDate改變資料後, 在點擊 GetData還是顯示 demo ！而不是我們期望的changed data 字串! 這就是我最初遇到的問題! 當然下面只是一個簡單的demo而沒有太多的實際意義!

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="ajax_Default" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server">    <title></title>    <script runat="server">        private static string data = "demo";        protected void Page_Load(object sender, EventArgs e)        {            if (IsPostBack) return;            if (!string.IsNullOrEmpty(Request.QueryString["ajax"]))            {                Response.Write(data);                Response.End();            }        }        protected void Unnamed1_Click(object sender, EventArgs e)        {            data = "Changed data";        }    </script>    <script type="text/javascript">        function createXmlHttpRequest() {            if (window.ActiveXObject) {                return new ActiveXObject("Microsoft.XMLHTTP");            } else if (window.XMLHttpRequest) {                return new XMLHttpRequest();            }        }        function test() {            //ajax請求地址,就是本頁面哈            var url = "Default.aspx?ajax=true";            /*                解決方案: var url = "Default.aspx?ajax=true&random=" + Math.random();                         var url = "Default.aspx?ajax=true&random=" + new Date().getMilliseconds();                後面跟一個隨機數或者時間戳記保證他請求的url每次都不一樣!這樣就不會被緩衝                2.在send()方法之前設定setRequestHeader                  XMLHttpRequest.setRequestHeader("If-Modified-Since","0")            */            var xmlHttpRequest = createXmlHttpRequest();            xmlHttpRequest.onreadystatechange = function() {                if (xmlHttpRequest.readyState == 4 && xmlHttpRequest.status == 200) {                    var context = xmlHttpRequest.responseText;                    document.getElementById("divInfo").innerHTML = context;                }            }            xmlHttpRequest.open("GET", url, true);            //xmlHttpRequest.setRequestHeader("If-Modified-Since","0");            xmlHttpRequest.send(null);        }    </script></head><body>    <form id="form1" runat="server">    <input id="getData" type="button" value="GetData" onclick="test();" />    <div id="divInfo">        </div>    <asp:Button runat="server" Text="changDate" onclick="Unnamed1_Click" />    </form></body></html>

上面的2種方法,我已測試通過!並解決了我的問題！

Technorati 標籤: ajax

本文章原先以中文撰寫並發佈於 aliyun.com，亦設英文版本，僅作資訊用途。本網站不對文章的準確性，完整性或可靠性或其任何翻譯作出任何明示或暗示的陳述或保證。如對該文章有任何疑慮或投訴，請傳送電郵至 info-contact@alibabacloud.com 並提供相關疑慮或投訴的詳細說明。職員會於 5 個工作天內與您聯絡，一經驗證之後，即會刪除該侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

Sales Support

1 on 1 presale consultation

Chat Contact Sales
After-Sales Support

24/7 Technical Support 6 Free Tickets per Quarter Faster Response

Open a Ticket
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

Learn More