再探AJAX - 簡單小範例

程式技術/Javascript 2006/08/29 04:22
views: 69398 times
利用原來的文章: http://diary.tw/tim/18 撰寫了一個更容易測試的 html 範例, 一則以測試同步及非同步, 另一則了解在IE及FF的 AJAX Callback 的差異.

幾件事情要特別小心:

1. browser cache:
在做 AJAX Callback 時, 若是 server side 程式不強迫 client side browser 不 cache 時, IE 會發生 callback response cache 的行為, 這個會讓 AJAX 取得的回應發生問題, 當然有多重方法可以解決, 在 FF 就沒有這種現象. 比較單純而又通用解決方法就是在 callback url 上動手腳, 和一般解決 cache 的方法相同, 這裡利用了 javascript 的時間戳記來將 url 變成每次都不同. 一般的實作方法有兩個, 一個是用 Date.parse(new Date()) 方法, 但時間比較不精確(每次取回的值最後三位皆為 000, IE, FF皆同), 另一則是 (new Date()).getTime() 似乎比較精確, 這兩個方法都是傳回從 January 1, 1970, 00:00:00, local time 開始的 milliseconds. 當然, server side 加不加上 cache control 的 header 就比較不影響了, 因為每次 browser 就會乖乖地來 request.

more..



top
FAV :: 收進你的MyShare個人書籤 :: 推推王 ::

Trackback Address :: http://diary.tw/tim/trackback/35

  1. alice 2006/09/04 17:09 MODIFY/DELETE REPLY

    關於重覆操作行為
    我發現初始時改寫成這樣就不會有問題了說
    if (window.XMLHttpRequest) // if Mozilla, Safari etc
    xmlhttp = new XMLHttpRequest()
    else if (window.ActiveXObject){ // if IE
    try {
    xmlhttp = new ActiveXObject("Msxml2.XMLHTTP")
    }
    catch (e){
    try{
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP")
    }
    catch (e){}
    }
    }
    else
    return false

    • Timothy 2006/09/05 00:33 MODIFY/DELETE

      重新調整了一下 initial 的結構, 發現確實有效:

      // initial xmlhttp start..
      if (window.ActiveXObject){ // if IE
      try{
      xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
      }
      catch(e){
      try{
      xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
      }
      catch(e){ xmlhttp = false; }
      }
      }
      else{
      if (window.XMLHttpRequest){ // if Mozilla, Safari etc
      try{
      xmlhttp = new XMLHttpRequest();
      }
      catch (e){ xmlhttp = false; }
      }
      else{
      if (window.createRequest){
      try {
      xmlhttp = window.createRequest();
      } catch (e) { xmlhttp=false; }
      }
      }
      }

      if(!xmlhttp) return false;

      // initial xmlhttp end..

      於是再做一個 sample 來進行測試:
      http://sample.diary.tw/1/ajax2.htm

      真的在 FF 下就不會有 exception 發生了, 更好玩的是, 多次操作在 FireBug 下的 response 都會有回應, 但是在顯示的時候仍只有第二次呼的回傳結果. 推測應該是 handler 第二次被設定掉的關係(和第一次的 instance 不同).

Write a comment


PREV : [1] : ... [196] : [197] : [198] : [199] : [200] : [201] : [202] : [203] : [204] : ... [230] : NEXT







9x9輕鬆看看   影音Fun享機 輕鬆自載—迅雷BT免開機下載盒 可聲控型行車紀錄數位攝錄影機 xDendee 銀髮族爸媽機-經典白 Panasonic 42吋Full HD數位電漿顯示器(TH-P42S10W) D-Link DIR-412 3G行動無線寬頻路由器 WR5204E Mini 無線寬頻分享器 HP v165w 16G 隨身碟 兆赫電子 ZP-520T 藍光劇院影音放影機 ZO TECH-SD201BT(海洋藍)硬碟分享下載器 [全民必搶]msi 微星 U100 10吋160G小筆電 SANYO  SAN068 親情機 Apacer宇瞻2.5吋SATAII介面MLC 32GB SSD固態硬碟 Apacer宇瞻A7 Pro 64GB 2.5吋SATAII SSD固態硬碟 SanDisk 8GB UltraII microSDHC記憶卡(公司貨) ACER X243W 24吋寬DVI-D 40000比1液晶顯示器 CASA 凱薩 RM/RMVB DVD播放機(AB-N98) 華碩【潮流玩家】2G_500G燒錄娛樂電腦-黑 Sony Ericsson J132 輕巧國民機(簡配/公司貨) 創見JetFlashTM T3 4GB極致輕薄行動碟-二入 PCI USB 2.0 無線網路寬頻分享器(環保工業包) SanDisk New Cruzer Micro 16GB 新麥可碟 PR-1108 85M電力線網路 無線分享器 ZINTV BT電視播放器 ( ZIN-6015T ) STEPDRAGON 20吋6段變速親子車3887-2(後安) D-LINK DHP-200 Power e點通電源線網路橋接器(雙包組) 二印白版DVD-R 4X燒錄片(100片) 30合1掌上型麻將機 Sandisk 2GB Micro SD記憶卡-平行輸入 Buffalo Mini Station 2.5吋 80GB SATA 行動硬碟 SanDisk 4GB Ultra II SDHC記憶卡 Nikon AF-S 18-200mm f/3.5-5.6G ED VR II代(平輸) Nikon AFS VR 18-200mm 3.5-5.6G (公司貨) Nikon AF-S VR 70-300mm f4.5-5.6G IF-ED(平行輸入) SONY VPCW126AW/T 10吋時尚行動潮流機(巧克棕) PowerSync 300W行動電源供應器(強化版)


 Waiting...