My Program :: 再探AJAX - 簡單小範例

再探AJAX - 簡單小範例

程式技術/Javascript 2006/08/29 04:22

views: 92043 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..

TAG AJAX, callback, Firefox, IE, javascript

Trackback 0 : Comment 2

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

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 不同).