XMLHttpRequest nesnesi bir sunucu ile veri alışverişi için kullanılır.
Bir sunucuya bir istek gönderin
Bir sunucuya bir istek göndermek için, kullandığımız open() ve send() XMLHttpRequest nesnesinin yöntemleri:
xhttp. open("GET", "ajax_info.txt" , true) ;
xhttp. send() ;
Yöntem | Açıklama |
---|---|
open( method, url, async ) | İsteğe türünü belirtir method : istek tipi: GET veya POST url : Sunucu (file) konum async : true (asynchronous) veya false (synchronous) |
send() | Sunucuya istek gönderir (used for GET ) |
send( string ) | Sunucuya istek gönderir (used for POST ) |
GET veya POST ?
GET basit ve hızlıdır POST , ve çoğu durumda kullanılabilir.
Ancak, her zaman kullanmak POST zaman istekleri:
- Bir önbelleğe dosya bir seçenek değildir (update a file or database on the server) .
- Sunucusuna veri büyük miktarda gönderme ( POST bir boyut sınırlamaları vardır).
- Kullanıcı girişini gönderme (which can contain unknown characters) , POST daha sağlam ve güvenli olduğunu GET .
GET İstekleri
Basit GET isteği:
Yukarıdaki örnekte, önbelleğe alınmış bir sonuç alabilirsiniz. Bunu önlemek için, benzersiz eklemek ID to the URL: ID to the URL:
Birlikte bilgi göndermek istiyorsanız GET yöntemi URL'ye bilgileri ekleyin:
POST İstekler
Basit bir POST isteği:
Için POST , bir HTML form gibi verileri, bir ekleme HTTP header ile setRequestHeader() . Eğer göndermek istediğiniz verileri belirtin send() yöntemi:
Örnek
xhttp.open("POST", "ajax_test.asp", true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send("fname=Henry&lname=Ford");
Kendin dene " Yöntem | Açıklama |
---|---|
setRequestHeader( header, value ) | İsteğe HTTP başlıklarını ekler header : Başlık adını belirtir value : başlık değerini belirtir |
url - Server 'da Bir Dosya
url parametresi open() yöntemiyle, bir sunucuda bir dosyaya bir adres:
xhttp. open("GET", "ajax_test.asp" , true) ;
dosya .asp ve (geri yanıt göndermeden sunucuda eylemleri gerçekleştirebilirsiniz) php gibi .txt ve .xml veya sunucu komut dosyası dosyaları gibi her türlü dosya olabilir.
Asenkron - True ya False ?
AJAX Asynchronous JavaScript ve XML için duruyor ve XMLHttpRequest nesnesi AJAX gibi davranmaya için async bir parametresi open() yöntemine true ayarlanmış olması gerekir:
xhttp. open("GET", "ajax_test.asp" , true) ;
asenkron istekleri gönderme web geliştiricileri için büyük bir gelişme olduğunu. sunucuda gerçekleştirilen görevlerin çoğu edilmesi çok zaman alır. AJAX önce bu operasyon asmak veya uygulamayı durmaya neden olabilir.
AJAX ile JavaScript sunucusu yanıtı için beklemek zorunda değildir, ancak bunun yerine can vermez:
- Sunucu yanıt beklenirken diğer komut yürütmek
- tepki ile başa zaman tepki hazır
Async=true
Zaman uyumsuz = true class = "notranslate" kullanırken, tepki onreadystatechange olay hazır olduğunda yürütmek için bir işlev belirtin:
Örnek
xhttp.onreadystatechange = function() {
if (xhttp.readyState == 4 && xhttp.status == 200) {
document.getElementById("demo").innerHTML = xhttp.responseText;
}
};
xhttp.open("GET", "ajax_info.txt", true);
xhttp.send();
Kendin dene " Bir sonraki bölümde onreadystatechange hakkında daha fazla bilgi edineceksiniz.
Async=false
Kullanmak için async=false , üçüncü parametre değiştirmek open() false yöntem:
xhttp. open("GET", "ajax_info.txt" , false) ;
Kullanımı async=false tavsiye edilmez, ancak birkaç küçük istekleri için bu Tamam olabilir.
sunucu yanıtı hazır olana kadar JavaScript, yürütmeye devam DEĞİL unutmayın. Sunucu meşgul veya yavaşsa, uygulama askıda veya duracaktır.
Note: Eğer kullandığınız zaman async=false , bir onreadystatechange fonksiyon yazmak değil - hemen sonra kod koymak send() deyimi:
Örnek
xhttp.open("GET", "ajax_info.txt", false);
xhttp.send();
document.getElementById("demo").innerHTML = xhttp.responseText;
Kendin dene "