一、URL
-
URL與URI
URL - 統(tǒng)一資源定位符
URI - 統(tǒng)一資源標(biāo)識(shí)符URL與URI的區(qū)別
所有的URL都是URI，但URI不一定是URL
完整的URL
1) 完整的url具有哪些元素
網(wǎng)絡(luò)協(xié)議://IP地址：端口號(hào)/路徑;參數(shù)?查詢數(shù)據(jù)#錨點(diǎn)
網(wǎng)絡(luò)協(xié)議 -
IP地址 - 每個(gè)電腦都有0.0.0.0每個(gè)
端口號(hào) - 電腦開(kāi)放給外部電腦訪問(wèn)接口
路徑 - 相對(duì)路徑和絕對(duì)路徑
參數(shù) - 某些方案會(huì)使用參數(shù)來(lái)指定輸入?yún)?shù)
查詢地址 -
key=value&key=value
錨點(diǎn) -
2) 一般使用時(shí)：
http://www.baidu.com/news
http://137.0.0.1:8080?key=value
http://localhost:80#mylink
二看政、Http協(xié)議
-
網(wǎng)絡(luò)協(xié)議
客戶端與服務(wù)端之間的協(xié)議
-
主流協(xié)議
http、socket、ftp饶深、pop3
-
http協(xié)議
1）多用與b/s架構(gòu)
2）問(wèn)題
短連接：每次客戶端與服務(wù)端交互時(shí)，先建立連接逛拱，交互完畢后敌厘，關(guān)閉連接 無(wú)狀態(tài)：服務(wù)端只能記得住當(dāng)次請(qǐng)求狀態(tài)3）http:1.0 - 目前主流版本
http:1.1 - 較新版本(向下兼容)
http:2.0 - 最新版本
三、http請(qǐng)求協(xié)議
-
客戶端發(fā)送一個(gè)請(qǐng)求朽合，應(yīng)該有如下三個(gè)部分：
請(qǐng)求行: 請(qǐng)求方法俱两、請(qǐng)求url 狀態(tài)碼、（http協(xié)議版本）
請(qǐng)求頭部: 說(shuō)明服務(wù)器要使用的附加信息
請(qǐng)求主體: 提交給服務(wù)器的請(qǐng)求數(shù)據(jù)
-
HTTP客戶端請(qǐng)求內(nèi)容詳解
1）請(qǐng)求行 - 請(qǐng)求的信息
請(qǐng)求類型 - get曹步、post/put 請(qǐng)求地址 如果是get請(qǐng)求宪彩，參數(shù)應(yīng)該拼到url的后面url?key=value，但請(qǐng)求體為空 如果是post請(qǐng)求讲婚，url后面不拼參數(shù)尿孔，參數(shù)放在請(qǐng)求體中 狀態(tài)碼 - 服務(wù)器端的狀態(tài)2）請(qǐng)求頭 - 反映給服務(wù)端的信息
格式為 key:value，key:value,... accept - 表示瀏覽器可接受的MIME類型 accept-Encoding - 瀏覽器能夠進(jìn)行解碼的數(shù)據(jù)編碼方式 accept-language - 表示服務(wù)端接受的語(yǔ)言 zh-cn:簡(jiǎn)體中文 zh-tw:繁體中文 zh - 中文 us -英文 connection - 表示當(dāng)前鏈接狀態(tài) keep-alive - 保持連接 host - 請(qǐng)求的服務(wù)器網(wǎng)址； referer - 表示當(dāng)前的請(qǐng)求來(lái)源 實(shí)現(xiàn)防盜鏈接 user-agent 獲取到用戶瀏覽器信息 cache-control -緩存控制 max-age 設(shè)置最大活動(dòng)周期,設(shè)置緩存保存的最大時(shí)間的單位為秒活合，為0代表不緩存 cookie - 將cookie自動(dòng)攜帶到請(qǐng)求頭 content-type：互聯(lián)網(wǎng)媒體類型雏婶；使用post請(qǐng)求必須設(shè)置這個(gè)屬性 也叫做MIME類型，在Http協(xié)議消息頭中芜辕，使用Content-Type來(lái)表示具體請(qǐng)求中的媒體類型信息尚骄。 <form>元素提交時(shí)默認(rèn)的類型 一般文件上傳時(shí)默認(rèn)為application/x-www.form-urlencoded Content-Length：請(qǐng)求內(nèi)容的長(zhǎng)度 對(duì)于POST請(qǐng)求來(lái)說(shuō)Content-Length必須出現(xiàn)3）請(qǐng)求體 - 存放請(qǐng)求參數(shù)
如果為post請(qǐng)求，有值侵续，如果為get請(qǐng)求為空
四倔丈、http響應(yīng)協(xié)議
-
服務(wù)端給客戶端響應(yīng)信息，應(yīng)該有如下三部分
響應(yīng)行：協(xié)議版本 狀態(tài)碼 原因短語(yǔ)
響應(yīng)頭部：
響應(yīng)主題： 返回給客戶端的響應(yīng)數(shù)據(jù)状蜗，可能是字符數(shù)據(jù)需五，也可能是字節(jié)數(shù)據(jù)
-
HTTP服務(wù)端響應(yīng)內(nèi)容詳解
1）響應(yīng)行
狀態(tài)碼 協(xié)議版本2）響應(yīng)頭
Allow:服務(wù)器支持哪些請(qǐng)求方法 GET、POST Content-Encoding 文檔的編碼(Encode) Cache-Control: 告訴客戶端轧坎，服務(wù)端的緩存配置 Connection - 表示當(dāng)前的連接狀態(tài) keep-alive 表示保持連接 content-length 響應(yīng)數(shù)據(jù)的長(zhǎng)度（大泻暧省） content-type - 響應(yīng)數(shù)據(jù)的mime類型 一般情況下：text/html Date - 當(dāng)前響應(yīng)的日期時(shí)間 keep-alive 設(shè)置保持連接的超時(shí)和最大存活時(shí)間 timeout=5 max=99 server - 服務(wù)器端的信息3）響應(yīng)體
服務(wù)器返回給客戶端的數(shù)據(jù)主體
五、擴(kuò)展內(nèi)容
1. 請(qǐng)求類型
get/post/head/put/delete/options/trace
2. 標(biāo)準(zhǔn)API - 標(biāo)準(zhǔn)的請(qǐng)求方式
get - 獲取數(shù)據(jù)
post - 修改數(shù)據(jù)
put - 新增數(shù)據(jù)
delete - 刪除數(shù)據(jù)
3. 狀態(tài)碼
1XX - 服務(wù)器的信息
2XX - 表示請(qǐng)求成功
200：請(qǐng)求成功
201：成功創(chuàng)建連接
202：接受請(qǐng)求
3XX - 表示重定向
302：表示重定向
304：表示服務(wù)端資源沒(méi)有變化缸血，訪問(wèn)緩存
問(wèn)題 - 這次請(qǐng)求沒(méi)有真正低訪問(wèn)服務(wù)器端
305：使用代理
4XX - 客戶端錯(cuò)誤
400：錯(cuò)誤的請(qǐng)求
404：網(wǎng)頁(yè)找不到
403：拒絕訪問(wèn)
405：請(qǐng)求類型不允許
5XX - 服務(wù)端錯(cuò)誤
500：服務(wù)端錯(cuò)誤
502：路徑錯(cuò)誤
504：請(qǐng)求超時(shí)
505：http版本不支持
4. MIME類型 - 文件類型
MIME類型是如何定義的
//定義MIME類型
<mime-mapping>
//文件的擴(kuò)展名
<extension>jpg</extension>
//對(duì)應(yīng)的MIME類型
<mime-type>image/jpeg</mime-type>
</mime-mapping>
常見(jiàn)的MIME類型
html - text/html
htm - text/html
css - text/css
js - text/javascript
json - application/json
jpg - image/jpeg
text - text/plain
5. 請(qǐng)求參數(shù)
1）get請(qǐng)求類型
將請(qǐng)求數(shù)據(jù) - url?key=value(瀏覽器地址)
安全性低
請(qǐng)求地址的長(zhǎng)度是有限制的
請(qǐng)求數(shù)據(jù)中包含中文的話蜜氨，需要轉(zhuǎn)碼
2）post請(qǐng)求類型
瀏覽器地址欄url，不包含請(qǐng)求類型
安全性相對(duì)比較高
對(duì)請(qǐng)求數(shù)據(jù)的長(zhǎng)度沒(méi)有要求
請(qǐng)求數(shù)據(jù)中包含中文的話捎泻，可以不轉(zhuǎn)碼飒炎，對(duì)中文的處理相對(duì)比較好
6. 控制HTTP頭部方法
可以配置每個(gè)HTML文件的HTTP-EQUIV標(biāo)簽控制緩存
<meta http-equiv="Cache-Control" content="no-cache">
發(fā)送請(qǐng)求
盡力減少請(qǐng)求次數(shù)——合理設(shè)置Expires時(shí)間、資源合并
是否有緩存
有緩存出現(xiàn)是否過(guò)期笆豁，如果過(guò)期不用
如果不過(guò)期郎汪，跟服務(wù)器進(jìn)行驗(yàn)證
在PHP頁(yè)面中控制響應(yīng)頭
header("Content-Type: image/jpeg");
六、緩存工作原理
客戶端可以自動(dòng)保存已經(jīng)訪問(wèn)過(guò)的文檔的副本闯狱，這些副本就成為“文檔緩存”
當(dāng)客戶端再次發(fā)送針對(duì)同一個(gè)URL的請(qǐng)求時(shí)煞赢，如果本地有“已緩存的副本”，就可以直接從本地存儲(chǔ)設(shè)備而不是遠(yuǎn)程服務(wù)器提取該文檔了哄孤。
-
數(shù)據(jù)緩存有下列優(yōu)點(diǎn)
減少了冗余的數(shù)據(jù)傳輸照筑，節(jié)省客戶端流量費(fèi)用
緩解服務(wù)器帶寬瓶頸的問(wèn)題，服務(wù)器可以節(jié)省出更多的帶寬
降低了對(duì)服務(wù)器的資源消耗和運(yùn)行要求
降低了由于遠(yuǎn)距離而造成的加載延時(shí)
七瘦陈、http基本優(yōu)化
網(wǎng)站性能優(yōu)化最主要的就是要減少HTTP請(qǐng)求及每次響應(yīng)中內(nèi)容的長(zhǎng)度朦肘。可以從連接過(guò)程中的下列方面加以考慮：
1双饥、域名解析
盡可能減少域名解析次數(shù)——減少跨站外部資源的引用
2、創(chuàng)建連接
努力減少連接創(chuàng)建次數(shù)——使用Keep-Alive避免重復(fù)連接
3弟断、發(fā)送請(qǐng)求
盡力減少請(qǐng)求次數(shù)——合理設(shè)置Expires時(shí)間咏花、資源合并
4鼓择、等待響應(yīng)
提高服務(wù)器端運(yùn)行速度——提高數(shù)據(jù)運(yùn)算及查詢速度
5、接收響應(yīng)
盡可能減小響應(yīng)數(shù)據(jù)長(zhǎng)度——啟用壓縮
八碌尔、安全的HTTP協(xié)議
HTTP協(xié)議本質(zhì)上屬于“明文傳輸”它碎，可能被竊聽(tīng)和篡改，政府棚菊、銀行等機(jī)密應(yīng)用需要需要“安全版本的HTTP”：http協(xié)議默認(rèn)端口80
HTTPS協(xié)議將消息發(fā)送給TCP層之前浸踩，先交給了一個(gè)安全層(由SSL或TLS協(xié)議實(shí)現(xiàn))，安全層負(fù)責(zé)對(duì)消息進(jìn)行加密和解密操作统求。https協(xié)議默認(rèn)端口443
一检碗、同步交互與異步交互
客戶端想服務(wù)器端發(fā)送請(qǐng)求，直到服務(wù)器端進(jìn)行響應(yīng)码邻，這個(gè)過(guò)程中折剃，用戶是不能做任何其他事情的(等)
客戶端想服務(wù)端發(fā)送請(qǐng)求，直到服務(wù)端進(jìn)行響應(yīng)像屋，這個(gè)過(guò)程中怕犁，用戶是可以做其他事情的(不用等)
二、AJAX
asynchronous javascript and xml,直譯中文-javascript和xml的異步
AJAX是一種用來(lái)改善用戶體驗(yàn)的技術(shù)己莺，其實(shí)質(zhì)是奏甫，使用XMLHttpRequest對(duì)象異步地向服務(wù)器發(fā)請(qǐng)求
服務(wù)器返回部分?jǐn)?shù)據(jù)，而不是一個(gè)完整的頁(yè)面凌受，以頁(yè)面無(wú)刷新的效果更改頁(yè)面中的局部?jī)?nèi)容
-
Ajax的核心對(duì)象
XMLHttpRequerst對(duì)象
-
獲取XMLHttpRequest對(duì)象
function getXhr(){
var xhr = null; if(window.XMLHttpRequest){ //除IE外的其他瀏覽器 xhr = new XMLHttpRequest(); }else{ xhr = new ActiveXObject("Microsoft.XMLHttp"); } return xhr;}
-
屬性
- readyState 請(qǐng)求狀態(tài)
0 尚未初始化 1正在發(fā)送請(qǐng)求 2請(qǐng)求完成 3請(qǐng)求成功阵子，正在接受數(shù)據(jù) 4數(shù)據(jù)接收成功-
status 請(qǐng)求響應(yīng)值
200 表示請(qǐng)求成功
202 請(qǐng)求被接受但處理未完成
400 錯(cuò)誤的請(qǐng)求
404 資源未找到
500 內(nèi)部服務(wù)器錯(cuò)誤，如asp代碼錯(cuò)誤等 responseText 服務(wù)器返回的文本
responseXML 服 器返回的xml胁艰，可以當(dāng)做DOM處理
-
方法
open(method,url) - 與服務(wù)端建立連接
send() - 向服務(wù)器端發(fā)送請(qǐng)求
abort() - 取消請(qǐng)求
getAllResponseHeaders()
得到響應(yīng)的所有http頭getResponseHeader()
獲取指定的http頭setRequestHeader()
指定請(qǐng)求的Http頭 -
事件
onreadystatechange事件
作用 - 監(jiān)聽(tīng)服務(wù)端的通信狀態(tài)改變當(dāng)Ajax對(duì)象的readyState的值發(fā)生了改變款筑，比如，從0變成了1腾么，就會(huì)產(chǎn)生readystatechange事件
三奈梳、實(shí)現(xiàn)ajax的異步交互步驟
創(chuàng)建XMLHttpRequest核心對(duì)象
固定寫(xiě)法-獨(dú)立編寫(xiě)與服務(wù)區(qū)建立連接
使用XMLHttpRequest對(duì)象的open(method,url)向服務(wù)器發(fā)送請(qǐng)求
使用XMLRequest對(duì)象的send()方法
請(qǐng)求參數(shù)的格式 - key=value-
接受服務(wù)器響應(yīng)的數(shù)據(jù)
使用XMLHttpRequest對(duì)象的readystatechange事件監(jiān)聽(tīng)服務(wù)器端的通信狀態(tài)
使用XMLHttpRequest對(duì)象的readyState屬性，判斷服務(wù)器端當(dāng)前狀態(tài)(0-4)
使用XMLHttpRequest對(duì)象的statue屬性解虱，判斷服務(wù)器端的狀態(tài)碼(200)
使用XMLHttp對(duì)象的responseText屬性攘须，接受服務(wù)器端的響應(yīng)數(shù)據(jù)
注意：get與post方式
get請(qǐng)求方式
send()方法不起作用，但是不能被省略
xhr.send(null) 請(qǐng)求參數(shù)殴泰，添加到url?key=value
post請(qǐng)求方式
必須要在send()方法調(diào)用之前于宙，使用setRequestHeader()方法設(shè)置請(qǐng)求頭，參數(shù)為key-value
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
