Objek XMLHttpRequest digunakan untuk bertukar data dengan server.
Untuk mengirim permintaan ke server, kami menggunakan metode open() dan send() dari objek XMLHttpRequest:
xmlhttp.open("GET","ajax_info.txt",true);xmlhttp.send();| metode | menggambarkan |
|---|---|
| buka ( metode , url , async ) | Menentukan jenis permintaan, URL, dan apakah akan menangani permintaan secara asinkron. metode : jenis permintaan; GET atau POST url : Lokasi file di server async : benar (asinkron) atau salah (sinkron) |
| kirim( tali ) | Kirim permintaan ke server. string : hanya digunakan untuk permintaan POST |
GET lebih sederhana dan lebih cepat daripada POST, dan berfungsi di sebagian besar situasi.
Namun, gunakan permintaan POST dalam situasi berikut:
Tidak dapat menggunakan file cache (memperbarui file atau database di server)
Mengirim data dalam jumlah besar ke server (POST tidak memiliki batasan ukuran data)
POST lebih stabil dan dapat diandalkan dibandingkan GET ketika mengirimkan input pengguna yang berisi karakter yang tidak diketahui
Permintaan GET sederhana:
Dalam contoh di atas, Anda mungkin mendapatkan hasil cache.
Untuk menghindari hal ini, tambahkan ID unik ke URL:
Jika Anda ingin mengirimkan informasi melalui metode GET, tambahkan informasi tersebut ke URL:
Permintaan POST sederhana:
Jika Anda perlu POST data seperti formulir HTML, gunakan setRequestHeader() untuk menambahkan header HTTP. Kemudian tentukan data yang ingin Anda kirim dalam metode send():
| metode | menggambarkan |
|---|---|
| setRequestHeader( header,nilai ) | Tambahkan header HTTP ke permintaan. header : menentukan nama header value : menentukan nilai header |
Parameter url dari metode open() adalah alamat file di server:
xmlhttp.open("GET","ajax_test.html",benar);File tersebut dapat berupa file jenis apa pun, seperti .txt dan .xml, atau file skrip server, seperti .asp dan .php (yang dapat melakukan tugas di server sebelum mengirimkan respons kembali).
AJAX mengacu pada JavaScript dan XML Asinkron.
Jika objek XMLHttpRequest akan digunakan untuk AJAX, parameter async dari metode open() harus disetel ke true:
xmlhttp.open("GET","ajax_test.html",benar);Bagi pengembang web, mengirimkan permintaan asinkron merupakan kemajuan besar. Banyak tugas yang dilakukan di server cukup memakan waktu. Sebelum AJAX, hal ini dapat menyebabkan aplikasi hang atau berhenti.
Dengan AJAX, JavaScript tidak perlu menunggu respon dari server, melainkan:
Jalankan skrip lain sambil menunggu respons server
Proses respons ketika sudah siap
Saat menggunakan async=true, tentukan fungsi yang akan dieksekusi sebagai respons terhadap status siap di acara onreadystatechange:
Anda akan mempelajari lebih lanjut tentang onreadystatechange di bab selanjutnya.
Jika Anda ingin menggunakan async=false, ubah parameter ketiga dalam metode open() menjadi false:
xmlhttp.open("GET","test1.txt",false);Kami tidak menyarankan penggunaan async=false, tetapi untuk beberapa permintaan kecil, hal ini dimungkinkan.
Ingat, JavaScript menunggu hingga respons server siap sebelum melanjutkan. Jika server sibuk atau lambat, aplikasi hang atau berhenti.
Catatan: Saat Anda menggunakan async=false, jangan tulis fungsi onreadystatechange - cukup masukkan kode setelah pernyataan send():