Cara menggunakan MSXML2.XMLHTTP pada JavaScript

Indonesian (Bahasa Indonesia) translation by Ambang Anasfa (you can also view the original English article)

Table of Contents Show

Akhir Script
Beberapa catatan perlu dipertimbangkan sambil menonton

Framework JavaScript telah merubah fungsi AJAX sederhana menjadi satu baris. Hal ini sangat luar biasa, mengingat fakta bahwa itu akan memerlukan lebih dari dua puluh baris untuk mencapai hal yang sama dengan Javascript mentah. Namun demikian, sangat penting untuk mempelajari apa "dibelakang layar".

Screencast

Akhir Script

Ini adalah sebuah skrip yang relatif sederhana yang akan memungkinkan Anda untuk permintaan asynchronously halaman dengan menggunakan fungsi "load (URL, CALLBACK)".

// Our simplified "load" function accepts a URL and CALLBACK parameter.
load('test.txt', function(xhr) {
  document.getElementById('container').innerHTML = xhr.responseText;
});

function load(url, callback) {
		var xhr;
		
		if(typeof XMLHttpRequest !== 'undefined') xhr = new XMLHttpRequest();
		else {
			var versions = ["MSXML2.XmlHttp.5.0", 
			 				"MSXML2.XmlHttp.4.0",
			 			    "MSXML2.XmlHttp.3.0", 
			 			    "MSXML2.XmlHttp.2.0",
			 				"Microsoft.XmlHttp"]

			 for(var i = 0, len = versions.length; i < len; i++) {
			 	try {
			 		xhr = new ActiveXObject(versions[i]);
			 		break;
			 	}
			 	catch(e){}
			 } // end for
		}
		
		xhr.onreadystatechange = ensureReadiness;
		
		function ensureReadiness() {
			if(xhr.readyState < 4) {
				return;
			}
			
			if(xhr.status !== 200) {
				return;
			}

			// all is well	
			if(xhr.readyState === 4) {
				callback(xhr);
			}			
		}
		
		xhr.open('GET', url, true);
		xhr.send('');
	}

// or with jQuery...
$('#container').load('test.txt');

Beberapa catatan perlu dipertimbangkan sambil menonton

onreadystatechange akan dijalankan lima kali sebagai halaman tertentu yang diminta.

0: uninitialized
1: memuat
2: sudah dimuat
3: interaktif
4: selesai

Nilai "4" adalah apa yang kita sedang cari. Setelah itu telah tercapai, kita tahu bahwa kami bebas untuk melakukan tindakan dengan data yang dikembalikan.

XMLHttpRequest dan ActiveXObject

Browser modern memanfaatkan "XMLHttpRequest" objek untuk membuat permintaan asynchronous. Artinya, jika Anda ingin mengabaikan IE6, Anda bebas untuk menghapus cek ActiveXObject - bagian ini.

		if(typeof XMLHttpRequest !== 'undefined') xhr = new XMLHttpRequest();
		else {
			var versions = ["Microsoft.XmlHttp", 
			 				"MSXML2.XmlHttp",
			 			    "MSXML2.XmlHttp.3.0", 
			 			    "MSXML2.XmlHttp.4.0",
			 			    "MSXML2.XmlHttp.5.0"];
			 
			 for(var i = 0, len = versions.length; i < len; i++) {
			 	try {
			 		xhr = new ActiveXObject(versions[i]);
			 		break;
			 	}
			 	catch(e){}
			 } // end for
		}

Sebaliknya, Anda bisa menulis "var xhr = new XMLHttpRequest();". Berhati-hatilah dengan metode ini. Setelah abstraksi sendiri "load" fungsi, sangat mudah untuk menjaga cek IE seperti itu.

Keluar dari ruang Global

Jika membuat beberapa permintaan, Anda mungkin mempertimbangkan memindahkan kode ke objek sendiri. Kemudian, daripada langsung memanggil fungsi "load", Anda bisa menggunakan "myObject.load();". Pedoman dasar untuk mencapai hal ini akan menjadi:

var ajax = {
   load : function() {
// paste here
   },

   otherMethod : someFunction() {
// paste here
   }
}

ajax.load();

Kesimpulan

Aku sudah tidak meragukan lagi bahwa beberapa dari Anda akan meninggalkan komentar menyatakan sesuatu di sepanjang baris, "Mengapa saya perlu melakukan ini ketika dapat dilakukan dengan hanya satu baris jQuery?" Jawabannya adalah karena Anda perlu mempelajari apa yang ada di bawah kap mobil Anda, sehingga untuk berbicara. Framework seperti Mootools dan jQuery membuat Javascript luar biasa dan dapat diakses oleh desainer. Jika Anda jatuh ke dalam kategori ini, saya sangat menyarankan Anda mengambil buku Javascript mentah juga. Tidak ada yang salah, menurut pendapat saya, dengan mempelajari keduanya secara bersamaan. Hanya pastikan bahwa Anda mempelajari keduanya!

Hal ini mirip dengan bekerja dengan WordPress jika Anda tidak tahu PHP. Tentu saja, mungkin - tapi Anda benar-benar ingin?

Mudah-mudahan, ini harus membuat Anda bangun dan berlari! Saya akan senang mendengar pikiran Anda! Semoga Akhir Pekan anda menyenangkan. Sampai jumpa pada hari Senin, atau di Twitter!