Internet & WWW 靜宜大學資訊工程學系 蔡奇偉 副教授 靜宜大學資訊工程學系 蔡奇偉 副教授.

Presentation on theme: "Internet & WWW 靜宜大學資訊工程學系 蔡奇偉 副教授 靜宜大學資訊工程學系 蔡奇偉 副教授."— Presentation transcript:

1 Internet & WWW 靜宜大學資訊工程學系 蔡奇偉 副教授 靜宜大學資訊工程學系 蔡奇偉 副教授

2 大綱 u 簡史 u 電腦網路 u 通訊協定 u 主從式架構 u Internet Services u WWW

3 簡史 u 1969, ARPA ( Advanced research project agency ) u 1985, NSF u Internet u 1990, TANet u HiNet & SEEDNet

4 電腦網路 個人電腦 雷射印表機

5 區域網路 資管系 計算中心 文學院 router FDDI

6 廣域網路 靜宜大學 LAN 逢甲大學 LAN 台灣大學 LAN Internet router gateway

7 從家裏上 Internet u 數據機 u Cable Modem u ADSL u ISDN u 數據專線 u DirectPC

8 數據機（ modem ） 撥接至學校 – Tel: 26514000 – 設定方式請參考 http://www.pu.edu.tw – 只需付電話費 撥接至 ISP (Internet Service Provider) – HiNet （ http://www.hinet.net ） – SEEDNet （ http://www.seed.net.tw ） – 設定方式請參考 ISP 提供的手冊 – 需付電話費與連線費 最高頻寬： 56Kbps 電話減價時段： 晚上 11 點至次日早上 8 點 周末

9 ADSL (Asymmetrical Data Subscribed Line) - 利用現有的電話線線路 - 中華電信局與 HiNet 提供 - 24 hr 連線，固定的網址 - 月費 1000 元以上，但不必付電話費與連線費 - 最大頻寬：下行 9Mbps 、上行 640 Kbps - http://www.adsl.hinet.net/

10 Cable Modem - 利用第四台的纜線 - 和信 http://www.giga.net.tw - 東森 http://www.ethome.com.tw/ - 大部分地區已經雙向傳輸 - 月費 1000 元左右 - 最大頻寬： 10Mbps

11 通訊協定（ Protocols ） 通訊協定是規定通訊元件如何 接收、傳送、修正、與轉換資 料的一套準則

12 TCP/IP u Internet 所使用的通訊協定 u TCP (Transmission Control Protocol （傳輸控制通訊協定） ) u IP (Internet Protocol)

13 data TCP packet Bytes 1 to 500 IP packet From: 140.128.9.1 To: 140.128.5.2 TCP/IP

14 如果將網際網路（ Internet ）視為一個 廣大的電子城，網路上的電腦視為住屋 ，電腦使用者視為居民的話。那麼，在 這樣的電子城遨遊之前，我們必須瞭解 城市的地圖。 網域與網址

15 IP 位址  一個 32 位元的整數值。  用（英式）句點將其區隔成四個 八位元的值，如： 140.128.5.2 129.9.7.81  網址名稱，如： simon.pu.edu.tw

16 tw edu Internet nctu pu simon simon.pu.edu.tw

17 simon.pu.edu.tw 小大

18 ca 加拿大 fr 法國 de 德國 uk 英國 dk 丹麥 fi 芬蘭 nl 荷蘭 tw 台灣 cn 中國大陸 hk 香港 sg 新加坡 jp 日本 kr 韓國 us 美國 （可省略）

19 com 商業團體 edu 教育團體 gov 政府單位 mil 軍事單位 org 其他（非營利）團體 net 網路供應單位

20 cwtsay@simon.pu.edu.tw

21 主從（ Client/Server ）架構 Client 客戶端 Server 伺服端 連線 / 上傳 下載

22 Internet 上的服務 u telnet （遠端簽入） telnet u ftp （檔案傳輸） ftp u e-mail （電子郵件） e-mail u BBS （電子佈告欄） BBS u news （網路論壇） news u gopher （地鼠資訊網） gopher u WWW （全球資訊網） WWW

23 WWW 簡介 靜宜大學資訊管理學系 蔡奇偉 副教授

24 WWW （全球資訊網） u 簡史 u WWW 的爸爸 u WWW 的優點 u WWW 的要素 u WWW 基本概念 u 網頁發行

25 WWW 簡史  WWW （ World Wide Web 全球資訊網） u 1989 u CERN （ European Laboratory for Particle Physics ） u Tim Berners-Lee

26

27 WWW 的優點 u 易學易用 u 資料量多且廣 u 資料取得迅速 u 多媒體文件 u 整合舊有的 FTP 、 Gopher 、 WAIS 、 E-mail 、 News 、等的網路資源。

28 WWW 的要素 u Internet u URL （ Uniform Resource Locators ） u HTTP （ HyperText Transfer Protocol ） u HTML （ HyperText Markup Language ） u WWW Servers u Browsers

29 WWW 基本概念 u WWW 伺服器 u 網站、網頁、與首頁 u WWW 瀏覽器 u 超連結（ Hyperlink ） u URL （ Uniform Resource Locator ）

30 WWW 伺服器 u具u具備網頁提供能力的電腦 u執u執行 WWW 伺服程式 u成u成為 Internet WWW 伺服器的額外條件： –電–電腦必須有一個固定的 IP 位址 u俗u俗稱為「站台」

31 常見的 WWW 伺服程式 u CERN HTTPd u NCSA HTTPd u Apache u Netscape u MS IIS u MS PWS u WebSite UNIX Windows

32 網站、網頁、與首頁 網站（ Web ） 儲存在一個 WWW 伺服器中與某 主題相關的 HTML 文件集合 網頁（ Web Page ） 網站中的一份 HTML 文件 首頁（ Home Page ） 進入網站的第一張網頁

33 瀏覽器 u 用於顯示網頁的程式 u 常見的瀏覽器： –Netscape Navigator –MS Internet Explorer –Lynx

34 www.nctu.edu.tw www.pu.edu.tw www.sun.com

35 URL （ Uniform Resource Locator ） u URL 的組成 u HTTP u FTP u TELNET u NEWS u GOPHER u MAIL u Local Files

36 URL 的組成 PROTOCOL://HOST_ADDRESS:PORT/PATH  HTTP  FTP  TELNET  NEWS  GOPHER  MAIL  FILE WWW 伺服器 的網址 news group e-mail address

37 URL 必須由 ASCII 碼所組成 ;%3B /%2F ?%3F :%3A @%40 =%3D &%26 下列字元是保留字元，在 URL 中有特殊意義， 如果必須使用於非特定的地方，則必須以字碼 方式出現。字碼的寫法格式是 %XX ， X 是一個 十六進位數 如： http://www.pu.edu.tw/prog.html%3B1

38 下列字元在某些系統中具有特殊意義，因此也不建議 使用在 URL 中，而應該以字碼的方式出現。 %3E “%22#%23 %25{%7B }%7D|%7C \%5C^%5E ~%7E[%5B ]%5D`%60

39 URL 範例（ http ） http://www.pu.edu.tw 靜宜大學 WWW 站台的首頁 http://www.pu.edu.tw/cindex/html 靜宜大學 WWW 站台的中文網站首頁 http://www.pu.edu.tw/~cwtsay 靜宜大學 WWW 站台使用者 cwtsay 個人網站首頁 http://www.pu.edu.tw/~cwtsay/course 靜宜大學 WWW 站台使用者 cwtsay 課程網站首頁 http://www.pu.edu.tw/~cwtsay/course/intro.html cwtsay 課程網站的網頁 intro.html

40 URL 範例（ ftp ） ftp://ftp.pu.edu.tw 匿名連結至靜宜大學 ftp 伺服器 ftp://user:passwd@ftp.pu.edu.tw 以帳號 user 密碼 passwd 連結至靜宜大學 ftp 伺服 器 ftp://user@ftp.pu.edu.tw 以帳號 user 連結至靜宜大學 ftp 伺服器。連結時， 將詢問密碼。

41 URL 範例（ telnet ） telnet://user:passwd@simon.pu.edu.tw 以帳號 user 密碼 passwd 遠程簽入主機 simon.pu.edu.tw telnet://user@simon.pu.edu.tw 以帳號 user 遠程簽入主機 simon.pu.edu.tw ，簽入 時將詢問密碼。 telnet://simon.pu.edu.tw 遠程簽入主機 simon.pu.edu.tw ，簽入時將詢問帳 號及密碼。

42 URL 範例（本機檔案） file://other.html 目前目錄中的 HTML 檔案 other.html file://image/photo.gif 目前目錄的子目錄 image 中的 GIF 影像檔案 photo.gif file://../doc/doc.html 目前目錄同一層目錄 doc 中的 HTML 檔案 doc.html file:///usr/etc/httpd/doc.html 絕對路徑 /usr/etc/httpd/doc.html 的 HTML 檔案

43 URL 範例（其他） mailto:user@pu.edu.tw 寄送電子郵件至 user@pu.edu.tw news:comp.infosys.www.announce 連結至網路論壇 comp.infosys.www.announce gopher://gopher.pu.edu.tw 連結至靜宜大學 gopher 伺服器 gopher.pu.edu.tw

44 網頁發行 u 發行網頁之前 u 發行網頁步驟 u 網頁編輯器 u WWW 站台的網頁結構 u 網站映射

45 發行網頁之前 u 自行架設 WWW 伺服主機，或向 ISP 申請 允許建立網站的帳號。 u 詢問如何傳送網頁至 WWW 伺服主機。 u 設置網頁製作電腦與其他周邊設備（如掃描 器等）。 u 安裝網頁製作相關的軟體工具（如網頁編輯 器、影像編輯器、多媒體編輯器等） u 安裝瀏覽器與 WWW 伺服程式來測試網頁

46 靜宜大學學生個人網站 1. 進入學術網路內 ( 如 telnet host1), 並在 shell 下. ( 即看 到 “ % ”) 執行下列指令一次： a) 輸入 "chmod +rx." b) 輸入 "mkdir html" c) 輸入 "chmod +rx html" d) 輸入 "cd html" 2. 將你的首頁取名為 “index.html” 擺在 html 目錄下。 3. 在 IE 中輸入 “http://www1.pu.edu.tw/~ 自己的帳號 ”, 或 輸入 “http://www1.pu.edu.tw/~ 他人的帳號 ”, 即可欣 賞首頁. 資料來源： http://www.pu.edu.tw/cindex/html/index.html http://www.pu.edu.tw/cindex/html/index.html

47 發行網頁步驟 u 編寫網頁 u 預覽網頁內容與排版效果 u 測試網頁超連結正確與否 u 上傳網頁至 WWW 伺服器 u 瀏覽 WWW 伺服器上更新後的網頁， 檢查是否正確。

48 網頁編輯器 u 記事本 u HotDog u HTML ABC u FrontPage u Dreamweaver u Netscape Composer HTML 文字編輯器 WYSIWYG 編輯器

49 站台網頁結構 / home 個人網站根目錄 tsay public_html （或 html ） index.html imgcourse chao public_html （或 html ） etc httpd doc 站台文件根目錄

50 網站映射 為了便利網站的管理與測試，你可以將你的網站目 錄樹結構與內容複製於網頁製作電腦上。 tsay public_html （或 html ） index.html imgcourse public_html （或 html ） index.html imgcourse C: 複製

51 網頁上傳 利用 ftp 程式 Windows 內建的 ftp 程式 ws_ftp CuteFtp 優點： 可以很方便地上傳整個網站的檔案內容 缺點： 必須自己追蹤網頁的更新

52 利用 Windows 的「 Web 發佈精靈」： Step 1: 選取 「開始 | 附屬應用程式 | Web Publishing 精靈」

53 Step 2: 選取欲發佈的檔案或目錄