環境
官方文檔：https://www.embedthis.com/goahead/doc/
源碼下載： goahead-4.1.0-src.tgz
系統平台：Ubuntu 12.04.4
gcc version 4.6.3
ajax
“Asynchronous JavaScript and XML”（異步JavaScript和XML)
我們操作網頁時往往只需要刷新網頁上的一部分數據甚至可能是一個文本框內的數據，但是采用傳統的刷新方式服務器會把整個頁面重新發送至瀏覽器，瀏覽器再加載整個頁面，這樣不僅浪費了帶寬，而且整個頁面刷新視覺上也不流暢。
ajax技術解決了這一問題，ajax的思路是我需要刷新局部數據時給服務器一個請求，服務器收到請求后將數據將需要刷新的數據回送，瀏覽器接受到數據后通過腳本更新相應位置的數據，這個過程必須是在后台進行的。實現這個過程的核心便是JavaScript對象XmlHttpRequest。該對象在是一種支持異步請求的技術。簡而言之，XmlHttpRequest使您可以使用JavaScript向服務器提出請求並處理響應，而不阻塞用戶。
ajax局部刷新實現
1.前端頁面添加 ajax 支持，並調用指定的 goaction 函數
<!DOCTYPE html> <html> <head> <title>test.html</title> <meta charset="UTF-8"> </head> <body> <p>Please log in</p> <form action=/action/test method="post"> <table> <tr><td>賬號:</td><td><input type="text" name="name"></td></tr> <tr><td>密碼:</td><td><input type="password" name="address"></td></tr> <tr><td><input type="submit" name="submit" value="submit"></td> <td><input type="reset" value="reset"></td></tr> </table> </form> <script type="text/javascript"> function loadXMLDoc() { var xmlhttp; if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else {// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { document.getElementById("myDiv").innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET","action/test",true); xmlhttp.send(); } </script> <div id="myDiv"><h2>需要刷新的局部內容</h2></div> <button type="button" onclick="loadXMLDoc()">通過 AJAX 實現局部刷新</button> </body> </html>
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
用回復的http文本 替換 id="myDiv" 節的內容
xmlhttp.open("GET","action/test",true);
xmlhttp.send();
向指定URL發送請求，goahead中將 goaction過程的后端C函數綁定到了具體的URL鏈接；
這樣向"action/test"發送GET請求，即會執行定義的 actionTest 函數，然后 ajax 語法就實現部分頁面的刷新；
2.后台 定義 “test” action函數
// Main 中添加 goAction定義 websDefineAction("test", actionTest); // goAction定義 static void actionTest(Webs *wp) { cchar *name, *address; name = websGetVar(wp, "name", NULL); address = websGetVar(wp, "address", NULL); websSetStatus(wp, 200); websWriteHeaders(wp, -1, 0); websWriteEndHeaders(wp); websWrite(wp, "<html><body><h2>name: %s, address: %s</h2></body></html>\n", name, address); websFlush(wp, 0); websDone(wp); }
3.編譯並測試
運行 ./m283-webs -v ./web/
在瀏覽器輸入 http://192.168.1.124/test.html
點擊 刷新 按鈕
這樣就實現了頁面的局部刷新
至此測試完成了 前后台控制和數據交互、頁面局部刷新功能。