在Web編程時，為了能與硬體互動，中間需要CGI來響應。一般的我們會採用Form的Action來與CGI互動，但是使用Form來互動，就必須要提交資料，要提交資料就會產生頁面的重新整理，如果是少量的，還可能可以接受，但如果是大量的，那就難以忍受了。那有什麼辦法可以改善呢？
我們知道，在Web編程中，AJAX是極常用的一種方式。採用AJAX可以有效減少頁面的重新整理，又能得到想要的資料更新。AJAX是一種非同步更新機制，在具體的實現上，有一個核心的部分就是XHR。
XHR是XMLHttpRequest的縮寫，在發送請求時，有GET和POST方法，也需要指定URL，這與表單提交方式有很多相似之處。那是否可以利用這個來與CGI進行互動呢？
CGI是通用閘道介面(Common Gateway Interface)的簡寫，在APACHE中，只需要開始CGI模組，就能實現對CGI的響應。具體配置可以參看該文(http://www.jb51.net/article/37987.htm)。
接下來就是相關的實現。我們先來實現HTML端的代碼，具體如下:
<html><head> <title>Async request test</title> <script> function Send(url, callback) { var xhr = new XMLHttpRequest(); xhr.onreadystatechange = function () { if (xhr.readyState == 4) { if ((xhr.status >= 200 && xhr.status < 300) || xhr.status == 304) //200:Success.304:Tell browser to read cache. { if (callback === undefined || callback === null) { return; } callback(xhr.responseText); } else { alert(xhr.responseText); } } } xhr.open("GET", url, true); xhr.send(null); } function Request() { var url = "test.cgi?Data=Hello"; Send(url,function (e) { alert(e); }); } </script></head><body> <input type="button" value="Test" onclick="Request()"></input></body></html>說明
1.Send函數是xhr的實現，這裡使用的是GET方法，如果想要實現POST方法，只要將GET改成POST即可。
2.Request中的test.cgi是請求CGI的URL，問題後面的Data=Hello是key-value對的資料，在CGI端可以將其截獲，並作出相應的處理。
下面是CGI端的實現代碼：
#include <stdio.h>#include <stdlib.h>#include <time.h>int main(void){ time_t current; struct tm *timeinfo; char *method; char *data; time(¤t); timeinfo = localtime(¤t); method=getenv("REQUEST_METHOD"); data=getenv("QUERY_STRING"); //這一句一定要加，否則非同步訪問會出現頁面異常 printf("Content type: text/html\n\n"); printf("Method:%s\n Cgi receive:%s\n Cgi back:%s",method, data,asctime(timeinfo));}說明
2.data=getenv("QUERY_STRING")是擷取xhr的資料。
3.回應xhr的請求時使用printf，注意需要添加("Content type:text/html\n\n")，後一個printf才是回應具體的資料。這裡我將xhr請求的方法和資料加上服務端的時間一起回給了xhr.
下面是執行的結果。
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
