陳廣鵬 ·XMLHttpRequest 介紹
在上一節(jié)我們已經(jīng)粗略的講過了 XMLHttpRequest 是 Ajax 的核心技術(shù)。是的，可以說，沒有 XMLHttpRequest 這樣的技術(shù)存在，Ajax 就是不完整的，甚至可以說就不會(huì)有 Ajax 這樣的技術(shù)存在。那么，什么是 XMLHttpRequest 呢？
1. XMLHttpRequest 的由來
首先倒推到 1999 年間，這一年，Microsoft 在 Internet Explorer 5.0 中首次使用了一個(gè)技術(shù)。通過這個(gè)技術(shù)，瀏覽器頁面可以不用通過頁面重載或者表單提交，就可以將信息發(fā)送到服務(wù)器，完成信息的交互。這個(gè)技術(shù)就是 ActiveX 對象，即 XMLHTTP。
這個(gè)技術(shù)發(fā)布之后，得到了業(yè)界的一致歡迎。直到 2000 年的時(shí)候，基本成為了一種標(biāo)準(zhǔn)。同時(shí)，Mozilla 、Opera 等也相繼實(shí)現(xiàn)了一種具有相同接口的原生對象，即我們現(xiàn)在所看到的 XMLHttpRequest 。后來，XMLHttpRequest 也成為了這個(gè)技術(shù)的名稱。
2. 什么是 XMLHttpRequest
XMLHttpRequest 實(shí)質(zhì)上就是一種具有發(fā)送異步請求功能的技術(shù)，是一個(gè)可以在 javaScript 、JScript 、VBScript 等腳本語言中使用的 API 對象。它可以通過異步發(fā)送 HTTP 請求，完成前后端的交互。在我們的客戶端界面上，無刷新交互只是一種表現(xiàn)，而異步發(fā)送請求才是這個(gè)技術(shù)的根本。
目前為止，XMLHttpRequest 早已成為正式的規(guī)范。并且在大多數(shù)瀏覽器上都得到了支持。
3. XMLHttpRequest 的屬性和方法
接下來我們會(huì)對 XMLHttpRequest 的屬性和方法做一個(gè)簡單的展開學(xué)習(xí)，主要是認(rèn)識一下 XMLHttpRequest 到底提供了一些什么功能屬性。為之后的學(xué)習(xí)做一個(gè)基本的概念性了解。
3.1 XMLHttpRequest 的屬性
3.1.1 標(biāo)準(zhǔn)屬性
| 屬性名 | 備注 |
|---|---|
| onreadystatechange | 當(dāng) readyState 發(fā)生變化時(shí)候觸發(fā) |
| readyState | 請求狀態(tài)碼。 |
| response | 返回一個(gè) Blob 、ArrayBuffer 、Document 或 DOMString。類型受 responseType 影響。 |
| responseText | 返回一個(gè) DOMString。請求不成功或者未發(fā)送情況下返回 null。 |
| responseType | 響應(yīng)類型。 |
| responseURL | 返回序列化 URL，URL 為空則返回空字符串。 |
| responseXML | 返回一個(gè) Document。請求未發(fā)送、不成功或者解析失敗，返回 null。 |
| status | 請求的響應(yīng)狀態(tài)。 |
| statusText | 返回一個(gè) DomString， 包含 http 響應(yīng)狀態(tài)。 |
| timeout | 超時(shí)。定義一個(gè)最大的請求響應(yīng)時(shí)間。 |
| ontimeout | 超時(shí)調(diào)用事件。 |
| upload | 上傳過程。 |
| withCredentials | 指定跨域請求是否帶有授權(quán)信息。 |
3.1.2 非標(biāo)準(zhǔn)屬性
| 屬性名 | 備注 |
|---|---|
| channel | 一個(gè) nsIChannel，當(dāng)執(zhí)行請求時(shí)，對象使用的通道。 |
| mozAnon | 布爾值。為 true 情況下，請求在將在沒有身份驗(yàn)證 header 頭和 cookie 的情況下發(fā)送。 |
| mozSystem | 布爾值。為 true 情況下，請求將不強(qiáng)制執(zhí)行同源策略。 |
| mozBackgroundRequest | 布爾值。指示是否是服務(wù)器的請求。 |
3.2 XMLHttpRequest 的方法
3.2.1 標(biāo)準(zhǔn)方法
| 方法名 | 備注 |
|---|---|
| abort | 中止請求 |
| getAllResponseHeaders | 返回所有用 CRLF 分隔的響應(yīng)頭的字符串的形式。沒有收到響應(yīng)則返回 null。 |
| getResponseHeader | 返回指定響應(yīng)頭的字符串。未收到響應(yīng)，或者響應(yīng)不存在該報(bào)頭，返回 null。 |
| open | 初始化一個(gè)請求。 |
| overrideMimeType | 重寫 MIME 類型。 |
| send | 發(fā)送請求。 |
| setRequestHeader | 設(shè)置 HTTP 請求頭。 |
3.2.2 非標(biāo)準(zhǔn)方法
| 方法名 | 備注 |
|---|---|
| openRequest | 初始化一個(gè)請求。 |
3.3 XMLHttpRequest 的事件
| 事件名 | 備注 |
|---|---|
| abort | 停止請求的時(shí)候觸發(fā)。 |
| error | 當(dāng)請求發(fā)生錯(cuò)誤的時(shí)候觸發(fā)。 |
| load | 請求成功完成的時(shí)候觸發(fā)。 |
| loadend | 請求結(jié)束的時(shí)候觸發(fā)。 |
| loadstart | 收到響應(yīng)數(shù)據(jù)的時(shí)候觸發(fā)。 |
| progress | 接收數(shù)據(jù)開始周期時(shí)候觸發(fā)。 |
| timeout | 超時(shí)未接收到數(shù)據(jù)的時(shí)候觸發(fā)。 |
4. 兼容性
即便 XMLHttpRequest 在絕大多數(shù)瀏覽器都得到支持，但仍有部分對象屬性和方法不被少數(shù)瀏覽器所兼容。我們可以通過 Can I use 進(jìn)行查閱。下面給出一個(gè)截至當(dāng)前為止 XMLHttpRequest 在各瀏覽器上的兼容性表格進(jìn)行參照。
5. 小結(jié)
- XMLHttpRequest 現(xiàn)在已經(jīng)成為了標(biāo)準(zhǔn)，并且被絕大部分的瀏覽器所支持，兼容性好。
- XMLHttpRequest 擁有豐富的屬性、方法及事件調(diào)用，滿足我們對異步請求的大部分需求。
2025 imooc.com All Rights Reserved |