成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码

資訊專欄INFORMATION COLUMN

Javascript:ajax

Yumenokanata / 2554人閱讀

摘要：而這一技術的核心便是對象簡稱。一個域名的組成協(xié)議子域名主域名端口號同源策略請求類型請求用于向服務器查詢某些信息。

XMLHttpRequest 
Ajax技術能向服務器請求額外的數(shù)據(jù)而無需加載頁面。而這一技術的核心便是XMLHttpRequest對象(簡稱XHR)。
XMLHttpRequest方法 
// 創(chuàng)建xhr對象
var xhr = new XMLHttpRequest();
xhr.open(method,url,async) 
接收3個參數(shù):要發(fā)送的請求的類型，請求的URL，表示是否異步發(fā)送請求的布爾值。

URL相對于當前頁面(也可以使用絕對路徑)

調用open()方法不會真正發(fā)送請求，而只是啟動一個請求以備發(fā)送

// 初始化請求
xhr.open("get",example.php,true)

Note:只能向同一個域(子域名和主域名都得相同)使用相同端口號和協(xié)議的URL發(fā)送請求。如果URL與啟動請求的頁面有任何差別，都會引發(fā)安全錯誤。

// 一個域名的組成

協(xié)議    子域名  主域名     端口號  
http:// www.   abc.com : 8080

同源策略

請求類型
GET請求
用于向服務器查詢某些信息。

可以將查詢字符串參數(shù)追加到URL末尾，以便將信息發(fā)送給服務器。對XHR而言，位于傳入open()方法的URL末尾的查詢字符串必須經(jīng)過正確的編碼才行。

Note:查詢字符串中的每個參數(shù)的名稱和值都必須使用encodeURIComponent()進行編碼，然后才放到URL的末尾;而且所有名-值對都必須由和好(&)分隔。

function addURLParam ( url, name, value ) {

    url += url.indexOf("?") === -1 ? "?" : "&";
    url += encodeURIComponent(name) + "=" + encodeURIComponent(value); 

    return url;
}
POST請求
用于向服務器發(fā)送應該被保存的信息。

POST請求應該把數(shù)據(jù)作為請求的主體提交。

PUT請求
向服務器發(fā)送想要更新的信息來替換服務上舊的信息
DELETE請求
刪除服務上的信息。

Note:服務器并不會強迫執(zhí)行它獲得的每一個請求。如果你隨意的瀏覽一個網(wǎng)站，并要求刪除它的主要頁面，很可能會失敗

xhr.send(string) 
接收一個參數(shù)，即要作為請求主體發(fā)送的數(shù)據(jù)。如果不需要通過請求主體發(fā)送數(shù)據(jù)，則必須傳入null
xhr.abort() 
取消異步請求。

調用這個方法后，xhr對象會停止觸發(fā)事件

不允許xhr對象訪問任何與響應有關的對象屬性

xhr.setRequestHeader() 
設置自定義的頭部信息。

接收兩個參數(shù):1.頭部字段的名稱和頭部字段的值。
必須在調用send()方法之前且open()方法之后，調用此方法。

xhr.open("get", "example.php", true);
xhr.serRequestHeader("MyHeader", "MyValue");
xhr.send(null);
xhr.getResponseHeader() 
傳入頭部字段名稱，可以取得相應的頭部信息,查詢響應中某個字段的值
xhr.getAllResponsHeaders() 
可以取得所有頭部信息的長字符串
XMLHttpRequest屬性 

/* 發(fā)送同步請求 */

// 創(chuàng)建xhr對象
var xhr = new XMLHttpRequest();

// 初始化請求
xhr.open("get",example.php,false);

// 發(fā)送請求
xhr.send(null);

在收到響應后，響應的數(shù)據(jù)會自動填充XHR對象的屬性，相關的屬性簡介如下

與響應有關的xhr屬性

status: 響應的HTTP狀態(tài)碼

statusText: HTTP狀態(tài)的說明 // 跨瀏覽器使用不可靠

responseText: 作為響應主體被返回的文本,獲得字符串形式的響應數(shù)據(jù)

responseXML: 如果響應的內容為"text/xml"或"application/xml",這個屬性中將保存包含著響應數(shù)據(jù)的XML DOM文檔

HTTP狀態(tài)碼

1XX 提示信息 - 表示請求已被成功接收，繼續(xù)處理

2XX 成功 - 表示請求已被成功接收，理解，接受

3XX 重定向 - 要完成請求必須進行更進一步的處理

4XX 客戶端錯誤 - 請求有語法錯誤或請求無法實現(xiàn)

5XX 服務器端錯誤 - 服務器未能實現(xiàn)合法的請求

/* 發(fā)送異步請求 */

// 創(chuàng)建xhr對象
var xhr = new XMLHttpRequest();

// 監(jiān)聽請求狀態(tài)
xhr.onreadystatechange = function () {
    if(xhr.readyState === 4) {
        if (xhr.status >= 200 && xhr.status < 300 || xhr.status = 304) {
            alert(xhr.responseText);
        } else {
            alert("Request was unsuccessful: " + xhr.status);
        }
    }
}
 
// 初始化請求
xhr.open("get",example.php,true);

// 發(fā)送請求
xhr.send(null);
表示請求響應過程的xhr屬性

readyState:

0。未初始化。尚未調用open()方法

1。服務器建立連接。已經(jīng)調用open()方法，但未調用send()方法

2。請求已接收。調用send()方法，但未接收到響應

3。請求處理中。接收到部分數(shù)據(jù)響應

4。請求完成。接收到全部響應數(shù)據(jù)，可以在客戶端使用了。

HTTP響應與請求體 
http—無狀態(tài)協(xié)議

請求過程
1.建立TCP連接
2.Web瀏覽器向服務器發(fā)送請求命令
3.Web瀏覽器發(fā)送請求頭信息
4.Web服務器應答
5.Web服務器發(fā)送應答頭信息
6.Web服務器向瀏覽器發(fā)送數(shù)據(jù)
7.Web服務器關閉TCP連接

HTTP請求包(瀏覽器信息) 
Request包的結構, Request包分為3部分

第一部分叫Request line（請求行)
第二部分叫Request header（請求頭）
第三部分是body（主體）。header和body之間有個空行，請求包的例子所示:

GET /domains/example/ HTTP/1.1 //請求行: 請求方法 請求URI HTTP協(xié)議/協(xié)議版本 

Host：www.iana.org //服務端的主機名 
User-Agent：Mozilla/5.0 (Windows NT 6.1)
AppleWebKit/537.4 (KHTML, like Gecko) Chrome/22.0.1229.94 Safari/537.4 // 瀏覽器信息 
Accept：text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8 //客戶端能接收的mine 
Accept-Encoding：gzip,deflate,sdch //是否支持流壓縮
Accept-Charset：UTF-8,*;q=0.5 //客戶端字符編碼集 

//空行,用于分割請求頭和消息體 

//消息體,請求資源參數(shù),例如POST傳遞的參數(shù)
HTTP響應包(服務器信息) 
和請求包一樣分為3個部分。
HTTP/1.1 200 OK                            // 狀態(tài)行

Server: nginx/1.0.8                       // 服務器使用的WEB軟件名及版本
Date:Date: Tue, 30 Oct 2012 04:14:25 GMT // 發(fā)送時間
Content-Type: text/html                 // 服務器發(fā)送信息的類型
Transfer-Encoding: chunked             // 表示發(fā)送HTTP包是分段發(fā)的
Connection: keep-alive                // 保持連接狀態(tài)
Content-Length: 90                   // 主體內容長度

//空行 用來分割消息頭和主體

FormDate

為序列化表單以及創(chuàng)建于表單格式相同的數(shù)據(jù)提供了便利。


var data = new FormData();
data.append("name","Nicholas");


跨資源共享

CORS(Cross-Origin Resource Sharing, 跨資源共享):定義了在必須訪問跨源資源時，瀏覽器與服務器如何溝通。


基本思想:使用自定義的HTTP頭部讓瀏覽器與服務器進行溝通，從而決定請求或響應是應該成功還是應該失敗。

IE對CORS的實現(xiàn)


cookie不會隨請求發(fā)送，也不會隨響應返回


只能設置請求頭部信息中的Conte-type字段


不能訪問響應頭部信息


只支持GET和POST請求


其他瀏覽器對CORS的實現(xiàn)


不能使用setRequestHeader()設置自定義頭部


不能發(fā)送和接收cookie


調用getAllResponseHeaders()方法總會返回空字符串


Comet

一種服務器向頁面推送數(shù)據(jù)的技術。


實現(xiàn)方式:



長輪詢


HTTP流


長輪詢

首先輪詢的意思就是,瀏覽器定時向服務器發(fā)送請求,看有沒有更新的數(shù)據(jù)。


短輪詢(也就是傳統(tǒng)輪詢)：瀏覽器定時向服務器發(fā)送請求，與服務器建立
長輪詢:

HTTP流

在頁面的整個周期內，只使用一個HTTP連接。


具體來說，就是瀏覽器向服務器發(fā)送一個請求，而服務器保持連接打開

文章版權歸作者所有，未經(jīng)允許請勿轉載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉載請注明本文地址：http://m.hztianpu.com/yun/79091.html

相關文章

  • JavaScript 異步機制及應用 入門教程

    摘要：異步與同步技術研究概念介紹異步簡寫同步簡寫用比方來比喻異步就是個人同時起跑起點和出發(fā)時間相同在起跑時不去關心其他人會啥時候跑完尼瑪這不廢話嗎大家都才起跑怎么知道別人多就跑完同步就是個人接力跑起點和出發(fā)時間不同且后一個人會等待前一個人跑完才能 1. 異步與同步 技術研究 (1). 概念介紹 異步: asynchronous 簡寫async 同步: synchronous 簡寫syn...

    BoYang 評論0 收藏0

  • Ajax筆記

    摘要：本文主要是我學習的筆記，不涉及到原理，只是記錄如何使用。成功的含義取決于方法資源已被提取并在消息正文中傳輸。是請求鏈接到服務器，服務器響應錯誤后服務器返回瀏覽器的狀態(tài)碼。是指響應時間，開始請求到接收到響應開始處理的時間，單位為。 本文主要是我學習ajax的筆記，不涉及到原理，只是記錄如何使用。如果有錯歡迎各位大佬指出。提前先轉一篇寫的非常全面的博客你真的會使用XMLHttpReques...

    macg0406 評論0 收藏0

  • JavaScript Ajax與Comet——“進度事件”的注意要點

    摘要：有以下個進度事件在接收到響應數(shù)據(jù)的第一個字節(jié)時觸發(fā)。在接收響應數(shù)據(jù)期間持續(xù)的觸發(fā)在請求發(fā)生錯誤時觸發(fā)在因調用方法而終止連接時觸發(fā)在接收到完整的響應數(shù)據(jù)時觸發(fā)在通信完成或者觸發(fā)，，事件后觸發(fā)。 有以下6個進度事件： loadstart: 在接收到響應數(shù)據(jù)的第一個字節(jié)時觸發(fā)。 progress: 在接收響應數(shù)據(jù)期間持續(xù)的觸發(fā) error: 在請求發(fā)生錯誤時觸發(fā) abort: 在因調用ab...

    ad6623 評論0 收藏0

  • JavaScript Ajax與Comet——“XMLHttpRequest2級”的注意要點

    摘要：并非所有的瀏覽器都完整的實現(xiàn)了級的規(guī)范，但是所有的瀏覽器都實現(xiàn)了它部分的規(guī)范。超時設定唯一支持的超時設定事件，對象的事件。方法用于重寫響應的類型。它能強迫服務器返回的數(shù)據(jù)類型給些為本方法提供的類型。 并非所有的瀏覽器都完整的實現(xiàn)了XMLHttpRequest 2 級的規(guī)范， 但是所有的瀏覽器都實現(xiàn)了它部分的規(guī)范。 FormData FormData類型 append()向其添加數(shù)據(jù)，...

    melody_lql 評論0 收藏0

  • JavaScript Ajax與Comet——“跨源資源共享”的注意要點

    摘要：注意請求和響應都不包含信息。對象的安全機制部分實現(xiàn)了的規(guī)范。請求返回后會觸發(fā)事件，響應數(shù)據(jù)保存在屬性中。無論是同源請求還是跨域請求，對于本地資源最好使用相對，在訪問遠程資源時再使用絕對。發(fā)送請求之后，服務器決定是否允許這種類型的請求。 通過XHR實現(xiàn)Ajax通信的一個主要限制，來源于跨域安全策略。在默認情況下，Ajax只能訪問與包含它的頁面位于同一個域中的資源。但是有時也需要一些跨域的...

    haobowd 評論0 收藏0

  • JavaScript Ajax與Comet——“XMLHttpRequest對象”的注意要點

    摘要：在中，對象是通過庫中的對象實現(xiàn)的?？梢詸z測對象的屬性，該屬性表示請求響應過程的當前活動階段。已經(jīng)調用但尚未接收到響應接收。由于內存原因，不建議重用對象。頭部信息對象提供了操作請求頭部和響應頭部信息的方法。建議使用自定義的頭部名稱。 在IE5中，XHR對象是通過MSXML庫中的ActiveX對象實現(xiàn)的。在IE中可能會遇到三種不同版本的XHR對象，即MSXML2.XMLHttp、MSXML...

    Martin91 評論0 收藏0

發(fā)表評論

0條評論

閱讀需要支付1元查看
<