Web Programming 網際網路程式設計 Darby Chang 張天豪 Web Programming 網際網路程式設計
Common Gateway Interface 通用閘道介面 CGI Common Gateway Interface 通用閘道介面 Web Programming 網際網路程式設計
Web Programming 網際網路程式設計
Web Programming 網際網路程式設計 CGI 它是一種介面,能讓你的網頁跟網頁伺服器溝通,達到跟使用者互動的效果 簡單來說,就是一個規定,你照著這個規定寫程式,瀏覽器就能跟你的程式溝通,符合這個規定的程式就叫 CGI 程式 附屬於 HTTP 通訊協定 CGI 程式和一般程式沒什麼不同,唯一的不同只有它的輸出入部分 客戶端 CGI 程式 網頁伺服器 HTTP 表單 程式輸入 HTML Web Programming 網際網路程式設計
Web Programming 網際網路程式設計 CGI 程式 程式語言 Perl 是一個廣泛被用來編寫 CGI 程式的語言,但 CGI 的一個目的是要獨立於任何語言的,只要這個語言可以在系統上運行 除 Perl 外,像 shell script, Python, Ruby, PHP, Tcl, C/C++ 和 Visual Basic 都可以用來編寫 CGI 程式 通用網關介面 - 維基百科,自由的百科全書 輸入 use CGI; my $cgi = new CGI; my $nick = $cgi->param(‘nick’); my $color = $cgi->param(‘color’); 輸出 print “Content-type: text/html\n\n”; # HTTP 標頭 print “Hello World!”; # 任何合法的 HTML Web Programming 網際網路程式設計
Web Programming 網際網路程式設計 測試 CGI 程式 透過瀏覽器傳資料給 CGI 程式 http://merry.ee.ncku.edu.tw/~id/do?nick=dirty&color=blue 實際使用時是利用 HTML 表單 <form action=“do” method=“post”> <input name=“nick” type=“text” /><br /> <select name=“color”> <option value=“blue”>Boy</option> <option value=“red”>Girl</option> </select> </form> HTML Forms and Input Web Programming 網際網路程式設計
Web Programming 網際網路程式設計 Perl 腳本語言,最強悍的地方是字串處理跟雜湊(hash) 第一行一定要是 #!/usr/bin/perl -w 請務必使用 use strict; Perl 為無型別(untyped)語言,不需要變數宣告這個彈性反而容易導致程式臭蟲 可以用任何語言,例如 PHP 取代,但盡量不要用 C/C++ 來寫 CGI 建議至少用 Perl 這種天生比較適合的語言幫忙處理輸出入,也就是再包一層,盡量減少最後面 C/C++ 程式的麻煩 my $result = `./a.out $nick $color`; Web Programming 網際網路程式設計
Web Programming 網際網路程式設計 Perl 檔案處理 open FH ‘res/member’ or die; # 開檔 while (<FH>) { # 檔案中的每一行 my ( $name, $nick ) = split “\t”; # 用 tab 分隔 $nick eq $user_nick and $user_name = $name and last; # 比對暱稱 } close FH; # 關檔 $_ = `/bin/cat _hello.html`; # 利用 Linux 指令讀檔 s/{name}/$user_name/g; # 取代 print “Content-type: text/html\n\n$_”; # 輸出 神奇的 $_ 變數,活用它,會讓程式碼精簡許多 有時寫起來就像英文 呼叫外部程式/指令 模板(template)的概念 Web Programming 網際網路程式設計
Web Programming 網際網路程式設計 一些小技巧 CGI 程式要設為可執行 chmod 755 do 可以直接在執行 Perl 程式,方便偵錯 ./do # 記得把輸入寫死 有模組幫忙把錯誤訊息輸出到網頁 use CGI::Carp “fatalsToBrowser”; 寫檔(確定檔案可寫,chmod 666 filename) open “>filename” or die; open “>>filename” or die; Web Programming 網際網路程式設計
Web Programming 網際網路程式設計
Today’s assignment 今天的任務 Web Programming 網際網路程式設計
Web Programming 網際網路程式設計 讓網頁有記憶的功能 針對你們的需求,設計至少一種跨電腦(即單純用Javascript做不到)的互動效果,如果真的沒有任何想法,那就設計一個留言裝置,至少可以收集一些使用者的意見 參考資料 Perl 學習手札 Perl - 維基百科,自由的百科全書 記得寄快照給助教 老師會在 11/6星期日 23:59 之後到各組的首頁去看,可以寄個報告(例如工作分配或是設計重點等等)給老師,以防老師眼殘沒注意到你們的特色 Web Programming 網際網路程式設計
Web Programming 網際網路程式設計 Appendix 附錄 Web Programming 網際網路程式設計
Web Programming 網際網路程式設計 剩下的時間 我們一定沒有時間把 Perl 教完,所以只能教特定的功能 不過我不確定你們需要的功能是什麼,所以剩下的時間我想讓同學思考你們網站需要的功能 調查一下上課方式 如果增加解決實際問題的時間… (office hour) vi, CSS, JavaScript Garden… Web Programming 網際網路程式設計