boa cgi實現ajax

最後更新：2018-07-26 來源：互聯網

上載者：User

創建阿里雲帳戶，並獲得超過 40 款產品的免費試用版；而企業帳戶則可以享有總值 $1200 的免費試用版。立即註冊！

主要是看到網上的一篇部落格http://blog.csdn.net/fdemon/article/details/6358520#quote，照個這篇部落格確實現不了正確的結果。現修改如下：

1. 建立一個Html網頁檔案。檔案名稱：test.html

<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
  <title>C+CGI+Ajax在S3C2440中的應用</title>
  <script language="JavaScript" src="xmlhttpreq.js"></script>
</head>
<body>
  <h3>擷取伺服器目前時間</h3>
  <p>伺服器目前時間是：<div id="current_time"></div></p>
  <input type="button" value="提交" onclick="sender()" />
</body>
</html>

2. 建立一個Javascript指令檔，這個檔案實現了Ajax進行非同步訪問伺服器。檔案名稱：xmlhttpreq.js

/*
*建立非同步訪問對象
*/
function createXHR()
{
var xhr;

    try
    {
        xhr = new ActiveXObject("Msxml2.XMLHTTP");
    }
    catch (e)
    {
        try
        {
            xhr = new ActiveXObject("Microsoft.XMLHTTP");
        }
        catch(E)
        {
            xhr = false;
        }
    }

    if (!xhr && typeof XMLHttpRequest != 'undefined')
    {
        xhr = new XMLHttpRequest();
    }

    return xhr;
}

/*
*非同步訪問提交處理
*/
function sender()
{
    xhr = createXHR();

    if(xhr)
    {
        xhr.onreadystatechange=callbackFunction;

        //test.cgi後面跟個cur_time參數是為了防止Ajax頁面緩衝
        xhr.open("GET", "cgi-bin/test.cgi?cur_time=" + new Date().getTime());

        xhr.send(null);
    }
    else
    {
        //XMLHttpRequest對象建立失敗
        alert("瀏覽器不支援，請更換瀏覽器。");
    }
}

/*
*非同步回呼函數處理
*/
function callbackFunction()
{
    if (xhr.readyState == 4)
    {
        if (xhr.status == 200)
        {
            var returnValue = xhr.responseText;

            if(returnValue != null && returnValue.length > 0)
            {
                document.getElementById("current_time").innerHTML = returnValue;
            }
            else
            {
                alert("結果為空白。");
            }
        }
        else
        {
            alert("頁面出現異常。");
        }
    }
}

3. 建立伺服器端應用程式。檔案名稱：test.c

#include <stdio.h>
#include <stdlib.h>
#include <time.h>

int main(void)
{
    time_t current;
    struct tm *timeinfo;
    time(&current);
    timeinfo = localtime(&current);

    //這一句一定要加，否則非同步訪問會出現頁面異常
    printf("Content type: text/html\n\n");

    printf("%s", asctime(timeinfo));
}

在Fedora 9的終端命令列編譯test.c，產生test.cgi檔案，如下：

arm-linux-gcc -o test.cgi test.c

4. 將test.html、xmlhttpreq.js兩個檔案下載到開發板的www目錄中。（註：www目錄是boa伺服器的主目錄。你可以在開發板的/etc/boa/boa.conf檔案的DocumentRoot節點配置成其他的目錄，那麼這三個檔案就下載到你配置的目錄中）。test.cgi放在cgi-bin目錄中這個目錄是boa的cgi配置目錄，請先確實這個目錄下的cgi能夠執行。

5. 把開發板串連上網路，在PC機上開啟瀏覽器並輸入：http://192.168.1.230/test.html（註：這個IP地址是你的開發板的IP，還有這個網段要跟PC的網段一致），運行效果，如圖:

點擊提交按鈕後，就會非同步訪問伺服器端cgi程式，擷取伺服器端的系統時間。可以看到按鈕在提交後瀏覽器並沒有重新整理就取回系統時間。運行效果圖如下：

以上是複製了網友的部分內容基礎上改過來的。

本文章原先以中文撰寫並發佈於 aliyun.com，亦設英文版本，僅作資訊用途。本網站不對文章的準確性，完整性或可靠性或其任何翻譯作出任何明示或暗示的陳述或保證。如對該文章有任何疑慮或投訴，請傳送電郵至 info-contact@alibabacloud.com 並提供相關疑慮或投訴的詳細說明。職員會於 5 個工作天內與您聯絡，一經驗證之後，即會刪除該侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

Sales Support

1 on 1 presale consultation

Chat Contact Sales
After-Sales Support

24/7 Technical Support 6 Free Tickets per Quarter Faster Response

Open a Ticket
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

Learn More