Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

PHP & AppServ

2,040 views

Published on

PHP基礎與開發環境的建立

Published in: Education
  • Be the first to comment

PHP & AppServ

  1. 1. 第 1 章 PHP 基礎與開發環境的建立 1-1 網頁設計的基礎 1-2 PHP伺服端網頁技術 1-3 建立PHP整合開發環境 1-4 測試 PHP 整合開發環境
  2. 2. 1-1 網頁設計的基礎 1-1-1 WWW 的基礎 1-1-2 WWW 的架構 1-1-3 客戶端網頁技術 1-1-4 伺服端網頁技術
  3. 3. 1-1-1 WWW 的基礎 - 說明 「 WWW 」( World Wide Web )全球資訊網簡稱 Web , 這是在 1989 年歐洲高能粒子協會, Tim Berners Lee 領導 的研究小組開發的 Internet 服務,一種主從架構和分散式 網路服務系統,可以在網路上傳送圖片、文字、影像和聲 音等多媒體資料。 Web 使用者只需啟動瀏覽程式(或稱瀏覽器)輸入 URL 網 址後,就可以檢視儲存在 Web 伺服器的網頁內容, Web 伺服器可以位在同一台電腦,或遠在世界的另一個地方, 換句話說,秀才不出門,能知天下事,只需在家中電腦, 就可以透過瀏覽程式存取全世界的資源。
  4. 4. 1-1-1 WWW 的基礎 - 常見的相關名詞常見的名詞 說明 首頁 英文名稱為 Homepage ,指的為連接 Web 伺服器後下載的第一頁文件 HTML 、網頁或稱為 Web 畫面、 HTML 網頁等 全名 Hypertext Markup Language ,屬於一種文件編排的語言,在瀏覽 XML 程式看到的內容是使用此語言製作的網頁 全名 Extensible Markup Language 可擴展標示語言也是一種標籤語言, 不過, XML 並不是編排內容,而是用來描述資料,因此,並沒有如 URLs 同 HTML 的預設標籤,使用者需要自行定義描述資料所需的各種標籤 全名 Uniform Resource Locations ,即 WWW 的萬用資源定位器,可以 連接網站和其他 Internet 資源,其格式為【 http://www.hinet.net 】以「 HTTP :// 」符號分隔,符號前為通訊協定;之後為伺服器的網域名稱 全名 Hypertext Transfer Protocol ,即 Web 使用的標準通訊協定, Web 伺服器與瀏覽程式間的資料傳送都是透過此通訊協定來進行資料交換 超文件 英文名稱 Hypertext ,這一種文件閱讀方式,透過超連接的導引,可以 在閱讀文件內容時,隨時檢視相關資料 超媒體 英文名稱 Hypermedia ,基本上它和超文件非常相似,只是原來超連接
  5. 5. 1-1-2 WWW 的架構 - 說明 WWW 全球資訊網是一種主從架構的電腦系統,在主從架 構的主端是「伺服端」( Server ),指的是 Web 伺服器 ,儲存 HTML 網頁和圖片等相關的多媒體資料;從端是「 客戶端」( Client ),也就是使用者執行瀏覽程式的電腦 ,負責和伺服器溝通和讀取伺服器的資料,傳送的是 HTML 網頁和相關檔案,如下圖所示:
  6. 6. 1-1-2 WWW 的架構 - HTTP WWW 使用「 HTTP 」( Hypertext Transfer Protocol )通訊協定將伺服器的資料傳送到瀏覽程 式,伺服器是處於被動角色,等待使用者藉著瀏 覽程式提出 HTTP 請求, Web 伺服器針對請求開 始傳輸資料,傳輸的資料為 HTML 網頁和相關的 多媒體檔案。 客戶端瀏覽程式透過網路連接接收資料後,將 HTML 網頁內容顯示出來,即進入網站時看到的網 頁內容。
  7. 7. 1-1-3 客戶端網頁技術 - 說明 在瀏覽程式顯示的網頁內容是一份 HTML 語言建 立的 HTML 網頁,這是靜態內容,並沒有互動效 果,我們可以使用網頁技術建立互動的動態網頁 內容,依執行位置分為:客戶端和伺服端網頁技 術。 客戶端網頁技術是指程式碼在使用者客戶端電腦 的瀏覽程式執行,瀏覽程式本身支援直譯程式, 可以執行客戶端網頁技術建立的程式碼。
  8. 8. 1-1-3 客戶端網頁技術 - Java AppletJava Applet Java Applet 是一種 Java 語言開發的應用程式,當 使用編譯程式將原始程式碼編譯成位元組碼後, 瀏覽程式需要使用 Java 直譯程式「 JVM 」( Java Virtual Machine )執行 Java Applet 。對於 Internet Explorer 來說, 3.0 、 4.0 、 5.0 版已經內建; 6.x 以上版本需要自行安裝 JVM 。
  9. 9. 1-1-3 客戶端網頁技術 –JavaScript ( Jscript )JavaScript ( Jscript ) JavaScript 是 Netscape 公司開發的「腳本語言」( Script Languages ),使用淺顯的程式語法,可以 讓初學程式設計者輕鬆建立網頁的互動效 果, Jscript 為微軟推出相容 JavaScript 的腳本語言 ,簡單的說, Netscape 或 Mozilla Firefox 支援 JavaScript ; Internet Explorer 支援 Jscript 。
  10. 10. 1-1-3 客戶端網頁技術 –ActionScript 與 FlashActionScript 與 Flash ActionScript 是 Macromedia 公司開發的腳本語言 ,其主要目的是讓 Flash 動畫電影檔產生互動效果 ,這是一種類似 JavaScript 語法的腳本語言。 Flash 是 Macromedia 公司的軟體名稱,可以用來 建立動畫效果的檔案,瀏覽程式只需安裝 Flash 播 放程式,就可以在網頁顯示 Flash 建立的動畫效果 。換句話說, Flash 加上 ActionScript 可以幫助我 們建立動畫效果的網頁應用程式。
  11. 11. 1-1-3 客戶端網頁技術 - VBScriptVBScript VBScript 腳本語言屬於微軟 Visual Basic 語言家族 的成員,全名 Microsoft Visual Basic Scripting Edition ,簡稱 VBScript 。 VBScript 是一種免費的 直譯語言,屬於客戶端網頁技術的程式語言,能 夠讓網頁設計者開發互動網頁內容,目前只有 Internet Explorer 瀏覽程式支援 VBScript 。
  12. 12. 1-1-3 客戶端網頁技術 - DHTMLDHTML DHTML ( Dynamic HTML )是一種在瀏覽程式建 立 HTML 動態效果的技術。 DHTML 是由三種網頁 技術組成,其說明如下表所示: 網頁技術 說明 HTML HTML 4.0x 版的 HTML 標籤, DHTML 使用 CSS 和腳 CSS 本語言來擴充 HTML 標籤 全名 Cascading Style Sheets ,中文稱為層級式樣式表, CSS 能夠重新定義 HTML 標籤,讓 HTML 標籤顯示不 腳本語言 主要是指 VBScript 或同的編排效果 Internet Explorer 瀏 JavaScript ,在 覽程式是 VBScript 和 Jscript
  13. 13. 1-1-3 客戶端網頁技術 - AjaxAjax Ajax 是 Asynchronous JavaScript And XML 的縮寫,中文就 是非同步 JavaScript 和 XML 技術。 Ajax 技術是由多種網頁 技術所組成,相關技術的說明如下表所示: 網頁技術 說明HTML/XHTML 和 在瀏覽程式顯示使用者介面和呈現相關資料 CSS XML 伺服端非同步傳遞的資料 XML DOM 當客戶端非同步取得 XML 資料後,可以進一步 使用 JavaScript 程式碼和 XML DOM 取出所需的XMLHttpRequest 物件 JavaScript 程式碼是透過 XMLHttpRequest 物件來 資訊 建立非同步的 HTTP 請求
  14. 14. 1-1-4 伺服端網頁技術 - 說明 伺服端網頁技術是在 Web 伺服器上執行的程式, 而不是在客戶端電腦的瀏覽程式執行。目前常用 的伺服端網頁技術有: CGI 、 ASP 、 ASP.NET 、 JSP 和 PHP 。
  15. 15. 1-1-4 伺服端網頁技術 - CGICGI 「 CGI 」( Common Gateway Interface )共通匣道介面提 供 Web 伺服器執行外部程式的管道, CGI 應用程式是一 種外部程式的執行檔,能夠使用多種程式語言來開發,例 如: Visual Basic 、 C 、 C++ 和 Perl ,程式需要編譯成執 行檔案來在伺服端執行,其架構如下圖所示:
  16. 16. 1-1-4 伺服端網頁技術 - ASPASP ASP ( Active Server Pages )從英文字面上解釋是 一種讓網頁在伺服器上動起來的技術,能夠將腳 本語言直接內嵌 HTML 標籤的網頁,在伺服端產 生動態的網頁內容。 ASP 技術可以使用多種語言來建立,例如: JavaScript 和 VBScript ,它不是一個執行檔,而是 一種在伺服端以直譯方式執行的網頁技術。
  17. 17. 1-1-4 伺服端網頁技術 - ASP.NETASP.NET ASP.NET 是 ASP 3.0 的下一個版本,屬於一種全新 的伺服端技術,使用「 CLR 」( Common Language Runtime )架構的 .NET 程式設計平台, 只需支援 CLR 的語言就可以在伺服端建立 Web 應 用程式。
  18. 18. 1-1-4 伺服端網頁技術 - PHPPHP PHP 是「 PHP: Hypertext Preprocessor 」的簡稱, 一種通用和開放原始碼( Open Source )的伺服端 腳本語言,可以直接內嵌於 HTML 網頁,特別適 用在 Web 網站的開發,主要是使用在 Linux/Unix 作業系統的伺服端網頁技術,目前在 Windows 作 業系統也可以執行 PHP ,而且支援微軟的 IIS 伺服 器。
  19. 19. 1-1-4 伺服端網頁技術 - JSPJSP 「 JSP 」( Java Server Pages )是昇陽的伺服端技 術,它是 Java 家族中和 ASP 一較長短的網頁技術 ,以 Java 語言來說, Java Applet 是下載到客戶端 執行的程式檔; Java Servlet 是在伺服端執行; JSP 是結合 HTML 和 Java Servlet 的一種伺服端網頁 技術。
  20. 20. 1-2 PHP 伺服端網頁技術 1-2-1 PHP 的基礎 1-2-2 PHP 的開發環境
  21. 21. 1-2-1 PHP 的基礎 - 說明 PHP ( PHP: Hypertext Preprocessor )是伺服端、 跨平台和內嵌於 HTML 網頁的腳本語言( Scripting Language ),屬於一種開放原始碼( Open Source )的伺服端網頁技術。 PHP 是一種廣泛應用的通用腳本語言,特別適用 在 Web 網站的開發。 PHP 最初只是一套使用 Perl 語言撰寫的工具程式,主要是用來追蹤線上履歷 表的存取,如今 PHP 在伺服端網頁技術已經成為 主要的腳本語言之一。
  22. 22. 1-2-1 PHP 的基礎 - PHP 的歷史 PHP 最初是由 Rasmus Lerdorf 在 1995 年使用 Perl 開發的一套工具程式, PHP 各版本演進的年代, 如下表所示: PHP 版本 年代 PHP/FI 1995 年中 PHP/FI 2.0 1997 年 11 月 PHP 3.0 1998 年 6 月 PHP 4.0 2000 年 5 月 PHP 5.0 2004 年 7 月
  23. 23. 1-2-1 PHP 的基礎 - PHP 的用途 PHP 是一種取代 CGI 程式的網頁程式語言,只要 是 CGI 可以實作的功能,都可以改用 PHP 程式來 建立, PHP 語言只需配合 Web 伺服器和瀏覽程式 的開發環境,就可以透過瀏覽程式執行 PHP 程式 ,並且顯示 PHP 執行結果的網頁內容。 不只如此, PHP 還可以配合伺服端的資料庫系統 建立網頁資料庫( Web Database ),直接連接和 存取資料庫的記錄資料在瀏覽程式顯示。
  24. 24. 1-2-2 PHP 的開發環境 PHP 語言是一種跨平台的伺服端網頁技術,支援 Linux/UNIX 、 Windows 和 Mac OS 等多種作業系統 ,在本書主要是說明 Windows 作業系統下的 PHP 開發環境,使用的 Web 伺服器、資料庫系統和瀏 覽程式,如下表所示: 作業系統 Web 伺服器 資料庫系統 瀏覽程式 Windows Apache MySQL Internet Explorer
  25. 25. 1-3 建立 Windows 的 PHP 開發環境 1-3-1 安裝 PHP 的整合套件 1-3-2 整合套件的基本使用 1-3-3 設定 PHP 的中文預設編碼
  26. 26. 1-3 建立 Windows 的 PHP 開發環境 PHP 是一種伺服端網頁技術,因為目前的 Web 網 站大都是搭配資料庫系統的網頁資料庫,所以在 Windows 作業系統建立的 PHP 開發環境(正確的 說是執行環境),需要同時安裝 Web 伺服 器、 PHP 和資料庫系統。 為了方便快速建立的 PHP 開發環境,建議直接使 用現成 WAMP ( Apache, MySQL, PHP for Windows )套件來自動安裝與設定 Apache 、 PHP 和 MySQL ,而不用自行一一安裝各種應用程式。
  27. 27. 1-3-1 安裝 PHP 的整合套件 WAMP 套件是一種整合的 PHP 安裝套件,可以自動安裝與 設定 PHP 、 MySQL 和 Apache 伺服器來建立 PHP 開發環境 。 常用的 WAMP 套件: • AppServ Open Project http://www.appservnetwork.com/ • XAMPP http://www.apachefriends.org/en/xampp.html • WAMP5 http://www.wampserver.com/en/ • AMPPS ( 後起之秀,值得關注 ) http://www.ampps.com/
  28. 28. 動態網頁 的系 統 架 構1. 使用者透過瀏覽器在網頁做查詢,瀏覽器將使用者的要求透過 Internet 傳 送到 Apache 網站伺服器2. Apache 網站伺服器中的 PHP 模組處理網頁的程式,並向 MySQL 資料 庫下查詢指令3. MySQL 伺服器將資料庫查詢的結果傳回給 Apache 網站伺服器4. Apache 網站伺服器將查詢結果轉回瀏覽器可以處理的形式,並透過 Internet 傳回給瀏覽器,讓瀏覽器呈現結果在網頁上供使用者瀏覽
  29. 29. 1-3-2 什 麼 是 AppServ AppServ 是一個整合幾個軟體的伺服器套件安裝程式,它包含: Apache HTTP Server/PHP/MySQL/phpMyAdmin 。 安裝 AppServ 後等於一併安裝了這幾個軟體。 只要一次的安裝動作, AppServ 便會自動設定好它們之間相關聯的設 定,毋需自行設定
  30. 30. 1-3-2 什麼是 AppServApache HTTP Server : 網站伺服器軟體,負責將網頁送給 PHP 處理。與網站相關的設定 ,譬如放置網站程式的主目錄,就是在 Apache HTTP Server 伺服 器軟體上設定的。通常簡稱為 Apache 。PHP : 伺服器程式語言,用來解析像 Apache 這樣的伺服器軟體所送過來 的 PHP 程式碼,解析之後產生的 HTML 網頁傳到瀏覽器,再由瀏 覽器解析 HTML 網頁,才是使用者看到的網頁畫面。
  31. 31. 1-3-2 什麼是 AppServMySQL : 關聯式資料庫系統的伺服器,它負責實際儲存網頁需要用到的資料。 在 MySQL 裡可以透過 SQL 指令查詢資料庫的內容,而它的操作 是命令模式,就像是在 DOS 底下的命令列( command-line )環 境。phpMyAdmin : 用 PHP 語言寫成的 MySQL 資料庫管理工具,它的操作環境是 Web 介面。同樣可以達成命令列模式可完成的操作:包括資料庫、 資料表格、主鍵值、索引、使用者權限… . 等的管理,與資料的異動 。
  32. 32. AppServ 環 境建置 (1/9) Step 1 首先連結到 AppServ 官方網站: • http://www.appservnetwork.com/ 32
  33. 33. AppServ 環 境建置 (2/9) Step 2 點選所下載的『 appserv-win32-2.5.10.exe 』 執行安裝。 33
  34. 34. AppServ 環 境建置 (3/9) Step 3 進入到 AppServ 的安裝畫面後,點選 『 Next 』繼續。 34
  35. 35. AppServ 環 境建置 (4/9) Step 4 確認完 License Agreement ( 授權合約 ) 後,點 選『 I Agree 』繼續。 35
  36. 36. AppServ 環 境建置 (5/9) Step 5 通常在選擇安裝路徑時不會隨意做更動,如需 變更請自行選擇安裝路徑後,點選『 Next 』繼續。 36
  37. 37. AppServ 環 境建置 (6/9) Step 6 此部分為整合各項架站軟體,因此除非個人的 特別需求,否則都一律勾選,最後點選『 Next 』繼 續。 37
  38. 38. AppServ 環 境建置 (7/9) Step 7 請依序輸入各欄位值後點選『 Next 』繼續。 Server Name 改 成 『 帳 號 .no- Server Name 改 成 『 帳 號 .no- ip.biz 』 ((在 www.no-ip.com 所 ip.biz 』 在 www.no-ip.com 所 Adminstrator’s Email Address Adminstrator’s Email Address 申請的網站名稱 )) 申請的網站名稱 則 是 輸 入 『 帳 號 則 是 輸 入 『 帳 號 @gmail.com 』 @gmail.com 』 Apache HTTP Port 是指伺服器 Apache HTTP Port 是指伺服器 要開放給使用者使用的 Http 的 要開放給使用者使用的 Http 的 服務埠這裡預設為 80 服務埠這裡預設為 80 38
  39. 39. ( 網 站名 稱 …)客制化 設 定 範 例 39
  40. 40. AppServ 環 境建置 (8/9) Step 8 設定 MySQL 資料庫管理者 root 登入用的密 碼,其設定如畫面所示,最後點選『 Install 』繼續並 等待安裝。 40
  41. 41. AppServ 環 境建置 (9/9) Step 9 安裝完成後,點選『 Finish 』,啟動 Apache 與 MySQL 。 41
  42. 42. Apache 啟動 中 42
  43. 43. 防火 牆 的 設 定 43
  44. 44. 1-4 測試環境磁碟是否有 Apache2.2 、 MySQL 、 php 和 www 四個子目錄。 在安裝的目錄下會 有 四個子目錄 www 是網站的預設網站主目錄,之後本書的網站都是要建在這 個目錄下,或者是在它下面再建不同子目錄以便做為不同網站 的網站主目錄。
  45. 45. 1-4-1 測試 Apache 和 PHP測試 Apache 伺服器和 PHP 是否可運作,可以直接用安裝好時即有的 PHP 程式。www 是網站的預設網站主目錄,從檔案總管下可看到 www 目錄下有兩個副檔名是 .php 的 PHP 程式: index.php 和phpinfo.php 。 在可以用這兩個程 式來測試 預設的網站主目錄
  46. 46. 1-4-1 測試 Apache 和 PHP Index.php 輸入網址測 試
  47. 47. 1-4-2 測試 MySQL DOS 模式 鍵入 mysql 鍵入 show databases; 鍵入 exit; 上一節 上一頁 下一頁 回目錄
  48. 48. 1-4-3 測試 MySQL Windows 模式 也可以從這 裡 進入 MySQL 輸入 MySQL root 管理者密碼
  49. 49. 1-4-3 測試 phpMyAdmin PHPMyadmin 的首頁畫 面 上一節 上一頁 回目錄
  50. 50. 1-5 安裝 PHP 整合 開發環 境 1-5-1 Dev-PHP 的安裝 1-5-2 設定 Dev-PHP 1-5-3 啟動與結束 Dev-PHP 1-5-4 Dev-PHP 的使用介面說明
  51. 51. 1-5-1 Dev-PHP 的安裝 Dev-PHP 是一套支援中文介面且完全 GNU 免費的 PHP 整合開發環境,提供強大功能來幫助讀者編 輯、剖析和執行 PHP 程式,或使用 PHP-GTK 函式 庫(已經包含在 PHP 套件中)。 Dev-PHP 不只可以在 Dev-PHP 編輯 HTML 網頁和 PHP 程式碼,還可以直接在 Dev-PHP 執行 PHP 程 式來預覽結果,其官方網址是: http://devphp.sourceforge.net/ 。本書使用的是 2.2.2.306 版(此版本支援全中文使用介面, 2.3 版的語言設定有些問題)。
  52. 52. 1-5-2 設定 Dev-PHP – 複製中文介面檔 Dev-PHP 預設執行畫面是英文介面,雖然內建中文介面語 言檔【 ChineseTraditional.lng 】,不過其翻譯內容並不完 整,筆者已經重新翻譯修訂成最完整的語言檔,且置於書 附光碟中。 請將檔案下載區的【 ChineseTraditional.lng 】語言檔複製 且覆蓋 Dev-PHP 安裝路徑「 C:Program FilesDev- PHP2lang 」路徑下的同名檔案。
  53. 53. 1-5-2 設定 Dev-PHP – 設定中文介面 執行「 Options 」→「 General Options 」指令,可以看到 「 General Options 」對話方塊。選【 Extra 】標籤,在【 Dev-PHP i18n 】項目選【 ChineseTraditional.lng 】,按 【 OK 】鈕,就可以看到使用介面改為繁體中文。 選 【 ChineseTraditional.l ng 】
  54. 54. 1-5-2 設定 Dev-PHP – 設定剖析器 請再執行「選項」→「一般選項」指令,可以看到「一般 選項」對話方塊。選【剖析器】標籤,如下圖所示: 在【 php-cgi.exe 】欄按後 面按鈕選 「 C:wampbinphpphp5. 3.0 」路徑下的 php- cgi.exe ,【 php.ini 】欄選 同路徑下的 php.ini 檔案,在 下方選內部瀏覽器 【 Internet Explorer 】
  55. 55. 1-5-2 設定 Dev-PHP – 設定 Web 伺服器 選【 Web 伺服器】標籤設定本地和外部 Web 伺 服器,如下圖所示: 在【本地伺服器路徑】欄選 WampServer 的預設路徑 「 C:wampwww 」(如果電腦有 安裝 Visual Studio ,請將【連接 埠】改為【 8888 】),下方的 【外部 Web 伺服器路徑】欄輸入 URL 網址【 http://localhost/ 】
  56. 56. 1-5-3 啟動與結束 Dev-PHP - 啟動 Dev-PHP 請執行「開始」→「所有程式」→「 Dev- PHP2 」→「 DevPHP 」指令啟動 Dev-PHP ,可以看到每日 提示訊息的對話方塊。按【關閉】鈕,就可以看到 Dev- PHP 的執行畫面,如下圖所示:
  57. 57. 1-5-3 啟動與結束 Dev-PHP - 結束 Dev-PHP 執行「檔案」→「離開 Dev-PHP 」指令即可結束 Dev-PHP 整合開發環境。
  58. 58. 1-5-4 Dev-PHP 的使用介面說明 在啟動 Dev-PHP 且關閉每日提示訊息的對話方塊後,就進 入整合開發環境的執行畫面,其使用介面的簡單說明,如 下圖所示:

×