//Logo Image
作者:馬鴻祥(2005-01-18);推薦:吳昌暉、徐業良(2005-01-18);最近更新:徐業良(2005-02-27)

PIC_SERVER教材(6)—動態WWW/HTTP伺服器之系統時鐘

本文接續PIC_SERVER教材(5),實現在PIC_SERVER網頁中顯示動態之系統時間,並簡單介紹動態EGI檔的觀念

1.     PIC_SERVER系統時鐘簡述

系統時鐘是系統的核心,PIC_SERVER的許多功能如網路資料傳遞(TCP_client模式)、數據記錄器的時間記錄(Time Stamping for Data Logger)、精確的定時資料蒐集(Data AcQuisition, DAQ)、即時數位控制(Real-Time Digital Control)、與馬達變速驅動等,皆需倚賴系統時鐘方可達成。PIC_SERVER的「系統時鐘(system clock)」的時間單位為0.1msec,系統時鐘自動更新週期“CLOCK_PERIOD”則可由使用者自行設定,內定值為100個系統時鐘週期,亦即10msec,或0.01秒。

系統時鐘自動更新計時的功能,係以PIC單晶片內建的硬體計時計數器(Timer)的中斷(Interrupt)功能來實現的,主程式中的初始化函數pic_SERVER_init()設定計時計數器的相關參數並啟動其中斷功能之後,每間隔CLOCK_PERIOD×0.1msec就會發生一次Timer中斷事件,此時PIC單晶片就會暫時停止執行主程式,轉而執行寫在pic_SERVER_clock.c裡面的中斷服務程式system_clock_Timer0_ISR(),更新time.tick, time.sec, clock.sec, clock.min, clock.hour等系統時鐘變數,更新之後再繼續執行主程式。系統時鐘的精確度決定於石英振盪器的精度(約30 ppm),一般而言每天的誤差低於5秒。

中斷處理是作業系統(Operation System)的核心工作,是深入單晶片的必修課程,入門範例請參閱PIC_PROTO教材,C:\YZ_PIC\Samples\Beginner資料夾中的yz_timer.cyz_clock.cyz_clock_adc.c、以及yz_INT_xxx.c7個範例程式。

上述PIC_SERVER的系統時鐘變數是存於RAM中,每當PIC_SERVER重置後,便把時間的記憶消除,因此我們看到的時間其實是系統開機後經歷的時間。如果需要與我們在台灣所慣用的中原標準時間(CST, China Standard Time)或格林威治標準時間(GMT, Greenwich Mean Time)一致的話,可由使用者作人工調整,或是向網路時間伺服器作校正與同步的動作(詳見範例程式ex_3_internet_clock.c)。

2.     動態網頁檔簡述

HTML是一種不可在瀏覽器中編輯的靜態式文件,它的設計原則是顯示資料與文件,並非用來處理資料,因而無法產生動態的資訊,缺乏互動性。但靈活易用的CGI(Common Gateway Interface)介面與HTML的結合,實現了互動式的動態連結。由於CGI是一種連接應用軟體和web server的標準技術,因此可視為HTML的功能延伸。

PIC_SERVER所採用EGI(Embedded Gateway Interface)介面的概念與CGI完全相同,取名為EGI是因為它是應用於「嵌入式系統(Embedded System)」,而非PCUnix系統,且與CGI略有差異之故。總而言之,EGI就是一種C語言軟體與HTML語言軟體之間的介面。

3.     範例程式說明

本範例中希望當HTTP client在網頁瀏覽器中鍵入PIC_SERVER的網址(如http://140.138.40.158),並按下ENTER鍵之後,瀏覽器軟體的視窗中呈現如圖1所示的系統時鐘,且每5秒更新一次。在這個範例中所需要的程式包含:

l          HTTP client端程式:用IENetscape等網頁瀏覽器即可

l          PIC_SERVER端網頁程式:ex_0b\index.htm, ex_0b\fmxpic.egi

l          PIC_SERVERC程式:ex_0_web_server.c

1. 用戶端畫面

接下來先介紹PIC_SERVER端所需的網頁程式,再說明PIC_SERVER端所需的C程式。

3.1 PIC_SERVER端的網頁程式的設計與製作

1的動態網頁畫面需要用兩個網頁程式才能實現,第一個是入口網頁index.htm如下:

1          <HTML>

2          <FRAMESET>

3          <FRAME src="fmxpic.egi">

4                    </FRAMESET>

5                    </HTML>

HTTP client在網頁瀏覽器中鍵入PIC_SERVER的網址http://140.138.40.158並按下ENTER鍵之後,瀏覽器就會向IP網址為140.138.40.158PIC_SERVER索取入口網頁檔案index.htm,當瀏覽器收到index.htm之後,看到第3行的指令,就會繼續向PIC_SERVER索取第3行指令中所要求的動態網頁檔案fmxpic.egi,在PC硬碟資料夾C:\YZ_PIC\Samples\pic_SERVER\Beginner\WebPage\ex_0b裡面的fmxpic.egi的檔案內容如下:

1          <html><meta http-equiv="refresh" content="5">

2          Welcome to pic_SERVER ! <br><br>

3          本網頁每 5 秒鐘自動更新乙次 <br><br>

4         目前時間 ( 年月日/時分秒/0.01 )@2

5         </html>

我們先用IE瀏覽器直接打開存放在硬碟中的index.htmfmxpic.egi這兩個檔案,檢視一下是否能呈現如圖1的畫面。實際測試結果如圖2所示,存在PC的硬碟中的fmxpic.egi並沒有顯示動態的系統時鐘,顯示的就只是寫在檔案中的字串“@2”

2. 硬碟中的fmxpic.egi測試結果

但是當PIC_SERVER從它的唯讀記憶體中取出fmxpic.egi這個副檔名為EGI的動態網頁檔案時,發現其中有“@”這個EGI提示字符,就會依據緊跟在EGI提示字符之後的EGI碼(在本例中就是那個2”),調用寫在pic_SERVER_egi.c裡面的回呼函數callback_HTTPdynamicEGIcodeHandler (int8 egi_code),該函數就會用“當時的”系統時鐘變數的數值資訊取代“@2”這兩個靜態的字符,傳送給遠端的HTTP client,使遠端HTTP client的螢幕上得以出現“動態的”PIC_SERVER時鐘,也就是說,HTTP client每次索取fmxpic.egi這個檔案時都會得到不同的文件,故名之為動態文件。EGI碼還有很多的應用方式,將於「PIC_SERVER教材(7)—動態WWW/HTTP伺服器之即時數據蒐集」中做更深入的介紹。由於入口網頁的副檔名一定是HTM,並不是EGI,因此圖1這個簡單的畫面還是必需用兩個檔案才能實現。當然,也可以在IE視窗中鍵入http://140.138.40.158/fmxpic.egi,向PIC_SERVER索取特定的檔案。

IE瀏覽器收到PIC-SERVER傳來的fmxpic.egi之後,看到網頁語法第一行裡的"refresh" content="5",便不斷地每隔5秒向PIC-SERVER索取fmxpic.egi。檢視PC硬碟中的index.htmfmxpic.egi這兩個網頁程式的執行效果無誤之後,我們就可以把這兩個檔案燒錄至PIC_SERVER的唯讀記憶體,接下來就是C程式了。

3.2 PIC_SERVER端的C程式

完成網頁設計與製作之後,接下來看看要如何讓PIC_SERVER用即時的系統時鐘取代EGI“@2”。所需的C程式與PIC_SERVER教材(3)的範例程式ex_0_web_server.c完全相同,在此便不再累述,原因是將即時的系統時鐘變數的數值取代EGI“@2”的程式已經寫在程式庫中的「樣板程式」裡了,就是3.1節中所提到的回呼函數callback_HTTPdynamicEGIcodeHandler()。因此,顯示動態系統時鐘的功能實際上只要寫fmxpic.egi這個EGI檔案就夠了(EGI檔也可以算是程式啦)。

ex_0_web_server.c的主程式main()內的無窮迴圈while(1)裡面,不斷執行的BIOS韌體函數bios_EtherNetHandler()收到遠方HTTP_client索取fmxpic.egi的請求後,就從唯讀記憶體24LC512裡面將檔案讀出,一旦發現檔案中有EGI碼,然後就會呼叫callback_HTTPdynamicEGIcodeHandler(),如圖3樣版程式中的第一行C程式中,把檔案中的字符@2置換為系統時鐘變數clock裡面的數值。

3. 樣版程式callback_HTTPdynamicEGIcodeHandler()片段

完整的C程式流程動線,請參閱「PIC_SERVER Quick Guide.pdf」【吳昌暉,http://pic-proto.mech.yzu.edu.tw】第3節,第7~8頁。

【實驗1

略微修改PIC_SERVER教材(5)實驗中設計的小組網頁,使能呈現系統時鐘,且每2秒更新一次。

【實驗2

請修改主程式 ex_0_web_server.c,在「#include "pic_SERVER_lib.h"」前面加一行「#define CLOCK_PERIOD 5000」,將系統時鐘的自動更新週期設定為0.5秒,然後將主程式的main()裡面的「SYSLED = !SYSLED;」,移到程式庫中的「樣板程式」裡,系統時鐘中斷服務程式system_clock_Timer0_ISR()的結尾處,編譯後重新執行程式,觀察LED閃爍的狀況,和圖1用戶端畫面所出現系統時鐘的數值。再改為「#define CLOCK_PERIOD 2000」,觀察其效果,並推測、解釋其原因。

再修改程式,設定系統時鐘週期為2.1msec,即476.2Hz,執行後還能看到LED閃爍嗎?請用示波器量測LED接腳的電壓信號,仔細看看時鐘週期是否為2.1 msec?請查查示波器的使用說明書,看看示波器的時鐘精度,有些只有1.5%喔!