分類
程式技術

Fiddler-HTTP Debugger

在寫 web 程式時, 常常需要除錯 http header 的時候, 或是要得到 browser 如何和 web server 溝通的過程時, 尤其是在寫 AJAX Code 的時候, 我們對於 packet level 的資訊會十分感興趣. 當然我們可以使用像是 sniffer 或是我常用的 ethereal 來進行封包的監聽, 再接著對這些監聽下來的封包分析. ethereal 可以利用一些 filter 或是關鍵字來進行封包的搜尋, 以方便在茫茫封包海中找到我們感興趣的資料.

有個方便的工具, 而且還是掛 microsoft 的工具, 是放在 Wininet 這個地方的監聽工具, Fiddler, 程式很小, 也很容易使用, 但因為是在 Wininet 這層, 所以只支援 IE, 像是 firefox 就是自行透過 socket 層實作 web request 就不支援, 另外像是 sleipnir 這種是用 IE 核心(其實也就是利用 Wininet 這組 api 進行 web reqeust) 的也支援, 簡單地說, 有用 Wininet 的 api 的應該都能用 Fiddler 來進行封包的監聽. (不過不包含 ftp, 僅有 wininet 的 http 部分)

閱讀全文 “Fiddler-HTTP Debugger”
分類
Javascript

有趣的JSON技術

寫 javascript 對一般的網頁程式設計人員來說, 應該是家常便飯, 舉凡一些需要在 client side 完成的事, 大多會利用 javascript 來操作, 例如滑鼠經過換色, 或是檢查 form (表單)在送出前的一些資料正確性檢查(ps. 一定要記得在 server side 也要再次檢查, 以確保資料的正確性)或方便使用者輸入的自動更正等功能.

javascript 的功能強大, 又加上高階, 物件化等特性, 使得撰寫 javascript 的程式設計人員十分愛用, 也方便許多在 client side 就可以先完成的一些動作, 再加上最近的 Ajax 風行, javascript 無疑變成十分熱門的語言.

JSON (Javascript Object Notation)相信很多人有聽過, 但也有很多人不知道這個東西, 他是附屬在 javascript 下的一組物件描述方法, 這個網站介紹十分詳細: http://www.json.org/, 有很容易了解的圖示幫助使用者了解 JSON 物件的描述方式.

JSON 是利用了成對的 {} 來包住各物件(object), 用成對的 [] 來包任各陣列(array), 用成對的 “” 來包住各字串, 用逗號來區隔各變數, 而資料型態有 string, number, array, object, 另外有三個常數, true, false, null. 下面描述了一個 object obj1 擁有兩個成員變數, 而另一個為 array 擁有 5 個 number 的範例:

{ 'obj1': {
  'child1':'value1',
  'child2':'value2'
  },
  'array1': [1, 2, 3, 4, 5]
};
閱讀全文 “有趣的JSON技術”
分類
懶得分類

ASP.NET Cache物件使用方式及應用

在使用 asp.net 對於效能有相當幫助的 Cache 功能我特別感興趣, 這篇文章將針對 Cache 的用法做個介紹. (使用 c# 做範例程式語言)

Cache 是在 Page 中取得的一個屬性, 本身是一個在 System.Web.Caching.Cache 型態, 基本上可以想成一個共用的全域變數(很類似之前設在 Application 的變數), 然而, 其功能可以搭配許多相依性參數進行設置, 以期能達到網頁效能的提昇.

我們先來看一下 Cache 的基本使用方式:
(範例1)

protected void Page_Load(object sender, EventArgs e)
{
    String strC1 = (String) Cache["c1"];
    if (strC1 == null)        {
        strC1 = DateTime.Now.ToString("yyyy/MM/dd hh:mm:ss");
        Cache.Insert("c1", strC1);
    }
    Response.Write(strC1);
}
閱讀全文 “ASP.NET Cache物件使用方式及應用”
分類
PHP

php error handling

今天來研究一下 php 的 error handling, 一般的程式錯誤, 很重要的一件事就是錯誤處理, php 當然也不例外. php 本身對於錯誤處理已有一套完整的設計, 讓程式設計人員可以很容易地進行錯誤處理.

我們可以參考內建 function 進行 error handler 設置, 這個 function 為 :
mixed set_error_handler ( callback error_handler [, int error_types] )

該 function 傳入的 callback function即為我們要使用的 error handling function, 該 function 定義如下:
handler ( int errno, string errstr [, string errfile [, int errline [, array errcontext]]] )

閱讀全文 “php error handling”
分類
WebTrend

Retrievr – 利用手繪找圖

Retrievr 利用手繪方式找圖的一個服務, 相較於目前使用文字式的找圖方式來說, 有很大的差異, 試用一下狀況覺得新奇大過於實用, 辨識效果不理想, 不過都還是在實驗階段, 這是一個十分有趣的服務.

下面是兩個測試畫面:

第一個是用紅色畫個心, 出來的結果如下:

閱讀全文 “Retrievr – 利用手繪找圖”
分類
Javascript

xmlRequest更換網頁內容

AJAX?

不就是這樣子嗎? 利用一種方法, 在不換頁的狀況下, request web 的 content 後, 進行訊息的顯示或是畫面的更新(dhtml), 這不就是 AJAX? 是的, 其實很容易也很簡單實現, 要做到不換頁更新畫面的方法就是這麼簡單.

閱讀全文 “xmlRequest更換網頁內容”
分類
blog服務

新增訪客地圖

新增訪客地圖分布, 該網站提供了一個秀出訪客累積拜訪的地圖服務, 每日訪客量 2500 以下為免費服務, 這其實是一個還蠻有趣的服務, 能提供你訪客分布的資訊. 在 google 的 analytics 也有一樣的服務(該圖形是 flash 產出), 不過是沒有提供給網站一個圖形化專用的 image link.

由於有加入了該網站的相關 script, 所以可以很容易地統計出使用者的 ip, 並統計記錄下來, 再根據統計結果產生圖檔, 以供網站顯示, 是一個蠻實用也有趣的功能.

網站連結:
http://clustrmaps.com/
可以參考本網站右下角區域, 另外附上 sample 圖檔:

google analytics 的 sample 為:

分類
WebTrend

video收集服務網站

http://www.vottie.com/

該網站類似 del.icio.us 及 HEMiDEMi 這類的書籤服務, 但是提供的是 video 這種 content 的集合, 將幾個必備的元素放入
1. comment
2. ranking
3. tag 及 tag cloud
4. ajax 技術應用

接收的格式是 embed 嵌入語法的 youtube, google video, vlog 等. 解析embed 語法後, 隨即帶出圖片連結, 基本上, 留在該網站上的內容僅有 embed 語法, content 都還是留在原 video 空間提供服務商.
比較特別的是“動態監控器”, 就是所有的 user activity 都記錄並公開. 以方便大家一同追蹤, 這對票選或下註解(comment)或是評分記錄, 檢舉記錄, 等使用者行為有一定的追蹤性及提出公平性的方法.

該網站從 3/27起迄目前僅有331支影片, 內容成長不快. 不過他是在解決目前分享影片不方便的地方, 並將 content 做匯整. 可參考:
http://vottie.wordpress.com/2006/03/27/hello-world/

原來該網站應該是做文字 content, 之後又改做 video content 囉. 可參考下面文章:
http://blog.bcse.info/303
http://www.wretch.cc/blog/MLChen&article_id=4399521
及參考網站:
http://www.livedigg.com/

分類
WebTrend

網誌內容收集應用

這篇文章要算是 WebTrend 還是 Blog 服務我也說不清.

基本上, 到了現在這個時候, 再來談 web contents, 好像已經不是產出的問題了. 大家都在寫網誌, 大家都在收集網站內容, 大家都利用這個媒體(我是指 internet)來發表, 收集內容.

閱讀全文 “網誌內容收集應用”
分類
blog服務

新增HEMiDEMi共享書籤

申請了一個 HEMiDEMi 共享書籤, 也將其可匯入於個人 blog 的語法帶進來首頁, 由於其語法為單純的 javascript, 所以很容易整合到自行的 blog 中, 但在使用後, 發現呈現上有些怪怪地, 於是追蹤一下 code, 發現多了一個 </div> 的語法, 整理如下:

(function(){ var bk=[   
                     .....   
                       ]
                       
document.write('<div class="hemidemi-digest-title"><style type="text/css">.hemidemi-logo img {border:none}</style>');
document.write('<div class="hemidemi-digest"');

document.write('<ul></div>');
for(var i=0,b;b=bk[i], i<7 && i<bk.length;i++){

 document.write('<li class="hemidemi-bookmark"><a class="hemidemi-bookmark-title" href="'+b.l+'" onclick="window.open(this.href);return false;">'+b.t+'</a>');
 
 document.write('</li>');
}
document.write('<div class="hemidemi-more"><a href="http://www.hemidemi.com/user/timhuang/bookmark" onclick="window.open(this.href);return false;">更多..</a></div>');
document.write('<br /><div class="hemidemi-logo">powered by <a href="http://www.hemidemi.com" onclick="window.open(this.href);return false;"><img src="http://www.hemidemi.com/images/hemidemi_53_10.png" title="HEMiDEMi - 共享書籤" /></a></div>');
document.write('</ul></div>') })()

— document.write(‘<ul></div>‘); —

有沒有看到那個奇怪的 </div> 語法呢, 突然出現在不該出現的地方, 真是奇怪了, 也就造成了有一些怪異的現象囉..

[2006/6/28 10:30]
才和網站反應問題, 很快地, 就能獲得解決, 還真不是普通的快. 在這裡給他拍拍手, 鼓勵一下, 值得推薦..
目前他們已將該紅色字的不正常 </div> 移除囉..