OpenWebSchool - 01 - WWW Intro
0 likes819 views
这份文件介绍了客户端-伺服器模型和网络通信过程，并详细说明了贬罢罢笔请求和回应的结构与方法。它探讨了贬罢惭尝的基本概念、标籤、属性以及编码方式，特别是鲍罢贵-8的重要性。文件还提到如何进行鲍搁尝编码，以便在贬罢罢笔请求中使用中文等特殊字符。
OpenWebSchool - 01 - WWW Intro
- 1. WWW Intro Ensky / 林宏昱
- 6. Client – Server ? 我們的網路世界也是一樣 ? 有一些商店（Server） ? 使用者是顧客（Client） ? 我想上某個網站的時候就連過去， Server永遠開著
- 7. Hostname and IP ? IP is an Unique identifier – 就像身分証一樣 ? 網路有自己的機制，可以讓你輸入IP就找到 那台機器。 ? http://140.113.41.8 – 但這不make sense ? http://www.nctu.edu.tw – It’s great!
- 8. Uniform Resource Identifier http://comic.ensky.tw/register ftp://ca.nctu.edu.tw Protocol (like FTP, HTTP, Telnet…) Host( Domain Name / IP ) Path URI = Protocol :// Host + Path
- 9. Uniform Resource Identifier ? 絕對連結 ? 所有網路資源都可以用一個絕對連結來代 表。 ? ftp://ca.nctu.edu.tw ? telnet://bs2.to ? ssh://bsd6.cs.nctu.edu.tw
- 10. Links ? In http://ensky.tw/test/test1/index.html ? A.txt -> http://ensky.tw/test/test1/A.txt ? ../A.txt -> http://ensky.tw/test/A.txt ? ../b/A.txt -> http://ensky.tw/test/b/A.txt ? ../../b/A.txt -> http://ensky.tw/b/A.txt ? /A.txt -> http://ensky.tw/A.txt
- 11. HTTP Basic（餐廳） ? 1.說中文 ? 2.清楚描述我要吃啥 ? 這就是協定(protocol) : 我和店家的協定
- 12. HTTP Request 我要 /index.php 好喔，給你
- 13. HTTP Request Overview ? http://comic.ensky.tw/register 1. 連到140.113.27.33:80 //就是comic.ensky.tw這個hostname轉換成的IP 2. 丟下面的文字 GET /register HTTP/1.1 Host: comic.ensky.tw ...
- 14. HTTP Request Method GET /register HTTP/1.1 Host: comic.ensky.tw OR GET http://comic.ensky.tw/register HTTP/1.1 Method URI Protocol_version Key: value
- 15. HTTP Request Method ? GET http://comic.ensky.tw/register HTTP/1.1 ? GET – Read, 讀取資料 ? POST – Create, 新增資料 ? PUT – Update, 修改資料 ? DELETE – Delete, 刪除資料
- 16. HTTP Request Feature Host: comic.ensky.tw Cookie: xx=yy; aa=bb; … Referer: http://comic.ensky.tw/ User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.1 (KHTML, like Gecko) Chrome/21.0.1180.60 Safari/537.1
- 17. HTTP Response 我要 index.php 好喔，給你
- 18. HTTP Response Overview HTTP/1.1 200 OK Set-Cookie: a=b; c=d; … Content-Type: text/html; charset=utf-8 Content-Encoding: gzip 文件內容(html) Protocol Code Response_text Key: value
- 19. Take a Break
- 20. HTML
- 21. HTML ? HTML規範了有什麼東西要被顯示在網頁上 ? 是一個Markup Language <段落> 這是一篇文章 </段落> <圖片 網址=“http://this.is.a.pic/pic.jpg”>
- 22. HTML <標籤名稱 屬性1=“值” 屬性2=“值2”> 子元素 </標籤名稱> <p> 這是一個真的段落 </p>
- 23. 贬罢惭尝呈现的是「文件」 嚴格來說， HTML不算是一種「程式語言」
- 24. HTML Tags <!doctype html> <html> <head> <meta charset=“utf-8”> <title>這是網頁的標題</title> </head> <body> <p>這是一個段落文字</p> </body> </html>
- 25. HTML Tags ? <head> 裡面放的是「關於這個網頁的資訊」 – 編碼 – 網頁標題 ? <body> 放的是「這個網頁的內容」 也就是所有顯示出來的東西
- 26. HTML Tags ? 其他Tag請自己看 ? 請務必要搞懂最基本的那些tags ? 比方說a, img, table, form, textarea, select, br, p, div, span, pre, style, link, script, …
- 27. HTML Attributes 每個元素會有不同的屬性可以設定 <img width=“123” height=“456” src=/slideshow/openwebschool-01-www-intro/15830658/“…”> 以下四個屬性是每個元素都有的 ? class - 元素的類別 ? id - 元素的唯一名稱 ? style - 元素的樣式 ? title - 元素的標題文字
- 28. HTML Entities 還記得C語言中，你為什麼不能宣告 int for = 1;嗎？ 因為for是C語言中的保留字 同樣的，HTML中也有所謂的「保留字」 比如說「<」這個符號就是
- 29. HTML Entities 還記得這行是什麼意思嗎？ <body> <p>這是一個段落文字</p> </body> 仔細看之後你會發現，在<p>之前有好多空白 (或者是tab) 但網頁上卻不會真的顯示出那些空白
- 30. HTML Entities 那如果我要打「<」或者是空白，怎麼辦？ 常見的保留字： < < > > & & ? © ® ? ? ™
- 33. Encodings 那時候網路可還沒有普及呢 大家用big5用爽爽，反正只有我們會用 所以沒差 但網路一普及就崩潰了阿 每個國家都有一套自己的編碼方法 我們有big5中國有GB2312日本有JIS
- 37. URL Encoding 網址有一套規範，叫做RFC 1738 裡面規定URL只能是ASCII的某些文字組成 因此若是你想在HTTP Request中使用中文 （比如說你想做一個抓漫畫機器人之類的） 需要作URL Encoding google：URL Encoding
- 38. Homework ? 搞懂HTML基本元素的用途、實際操作看看 ref: http://goo.gl/QVoic ? 搞懂這份投影片介紹過的東西 ref: http://www.google.com.tw ? 練習1：自我介紹