AJAX Nedir?
AJAX (Asynchronous Javascript And XML), XMLHttpRequest nesnesi kullanarak sunucu-istemci iletişimini sağlar. Veri alış-verişi birçok farklı format ile gerçekleştirilebilir. Bunların başında JSON, XML, HTML ve basit yazı dosyaları gelir. AJAX’ın asenkron yapısından dolayı web sayfalar tekrar tekrar yüklenmeye ihtiyaç duymadan güncellenebilir.
AJAX’a Neden İhtiyaç Duyuyoruz?
AJAX daha kullanılmaya başlanmadığı zamanlarda (1990 öncesi) bir web tasarımlarda anlık dinamikleştirme yapabilmek çok kolay değildi. Varsayalım ki bir web siteniz var ve puanlama sistemine sahip içerikleriniz mevcut. Web sitenizi ziyaret eden kullanıcılarınız puan kullanmaya devam ettiği sürece puanların her kullanıcıda aktif ve dinamik olarak güncellenmesini istiyorsunuz. Bu problemi AJAX öncesi dönemde çözmek istediğinizde tek yapabileceğiniz kullanıcılarınızın görüntülüyor olduğu web sayfaları belirli aralıklarla yeniliyor olmanız gerektiğidi. Fakat AJAX ile birlikte sunucu-istemci etkileşimi asenkron bir yapıya kavuştu. Bundan sebep artık web sayfalarını belirli aralıklarla yenilemenize ihtiyaç kalmadı.
Başka bir bakış açısından yaklaşmak gerekirse aklımıza en çok kullandığımız Google arama motoru gelecektir. Aramak istediğiniz kelimeyi ya da cümleyi Google arama motoruna girmeye başladığınız andan itibaren Google sizin yazdıklarınızı tamamlamak için çeşitli öneriler sunmaya başlar. Bu yapının dinamik ve kesintisiz olmasını da AJAX’a borçluyuz.
Google Ajax İşlemi
AJAX Ne Zaman Yaygınlaşmaya Başladı?
AJAX her ne kadar 1990’ların ortalarından beri hayatımızda olsa da yaygınlaşması ve kullanımının giderek artması Google’ın AJAX’a olan talebiyle oldu. 2004 yılından itibaren Google Mail ve Google Maps ile birlikte web uygulamaların bu yapıyı kullanarak sunucu etkileşimine daha da önem vermesiyle AJAX’ın yaygınlaşması gün geçtikçe daha da arttı.
Google Maps Ajax
AJAX’a Bir Alternatif Var Mı?
Aralık 2009 yılına gelindiğinde WebSocket fikri duyuruldu. WebSocket ile birlikte HTTP (Hypertext Transfer Protocol)’un kullandığı “bağlan, iletişime geç ve bağlantıyı sonlandır” mekanizması artık “bağlan ve iki taraftan birisi (sunucu-istemci) bağlantıyı sonlandırana kadar iletişimi sıcak tut” sistemine geçti. Artık AJAX olmadan WebSocket ile web sayfalar yenilenmeden anlık ve dinamik olarak sunucu-istemci iletişimi sağlanabilir oldu.
AJAX İle HTTP İsteği Nasıl Yapılır?
AJAX ile HTTP isteği gerçekleştirmeye başlamadan önce XMLHttpRequest nesnesininin bir örneğini (instance) oluşturuyoruz.
httpRequest = new XMLHTTPRequest();
HTTP isteğini göndermeden önce isteğe gelecek cevabı dinleyeceğimiz fonksiyonu çağıracağız.
httpRequest.onreadystatechange = function() {
// Sunucudan gelecek cevabın yorumlanmasını ve işleme alınmasını burada gerçekleştirebilirsiniz.
};
Bunun ardından bir istek gönderebiliriz.
httpRequest.open(“GET”, “ , true);
httpRequest.send();
Yukarıdaki örneğe yakından göz attığımızda Ziyaretçiler için gizlenmiş link,görmek için Giriş yap veya üye ol. web sitesine bir HTTP GET isteği gönderdiğimizi görüyoruz. Fonksiyonun aldığı 3’üncü parametre olan true ile Javascript kodlarının çalıştırılmasının asenkron hale gelmesini sağlıyoruz. Böylelikle HTTP isteğimize cevap alana kadar rahatça web sayfayı kullanmaya devam edebiliriz.
Bunlara ek olarak HTTP isteği gönderirken HTTP başlığı da yapabilmek mümkün.
httpRequest.setRequestHeader(“Content-Type”, “text/html”);
AJAX (Asynchronous Javascript And XML), XMLHttpRequest nesnesi kullanarak sunucu-istemci iletişimini sağlar. Veri alış-verişi birçok farklı format ile gerçekleştirilebilir. Bunların başında JSON, XML, HTML ve basit yazı dosyaları gelir. AJAX’ın asenkron yapısından dolayı web sayfalar tekrar tekrar yüklenmeye ihtiyaç duymadan güncellenebilir.
AJAX’a Neden İhtiyaç Duyuyoruz?
AJAX daha kullanılmaya başlanmadığı zamanlarda (1990 öncesi) bir web tasarımlarda anlık dinamikleştirme yapabilmek çok kolay değildi. Varsayalım ki bir web siteniz var ve puanlama sistemine sahip içerikleriniz mevcut. Web sitenizi ziyaret eden kullanıcılarınız puan kullanmaya devam ettiği sürece puanların her kullanıcıda aktif ve dinamik olarak güncellenmesini istiyorsunuz. Bu problemi AJAX öncesi dönemde çözmek istediğinizde tek yapabileceğiniz kullanıcılarınızın görüntülüyor olduğu web sayfaları belirli aralıklarla yeniliyor olmanız gerektiğidi. Fakat AJAX ile birlikte sunucu-istemci etkileşimi asenkron bir yapıya kavuştu. Bundan sebep artık web sayfalarını belirli aralıklarla yenilemenize ihtiyaç kalmadı.
Başka bir bakış açısından yaklaşmak gerekirse aklımıza en çok kullandığımız Google arama motoru gelecektir. Aramak istediğiniz kelimeyi ya da cümleyi Google arama motoruna girmeye başladığınız andan itibaren Google sizin yazdıklarınızı tamamlamak için çeşitli öneriler sunmaya başlar. Bu yapının dinamik ve kesintisiz olmasını da AJAX’a borçluyuz.
Google Ajax İşlemi
AJAX Ne Zaman Yaygınlaşmaya Başladı?
AJAX her ne kadar 1990’ların ortalarından beri hayatımızda olsa da yaygınlaşması ve kullanımının giderek artması Google’ın AJAX’a olan talebiyle oldu. 2004 yılından itibaren Google Mail ve Google Maps ile birlikte web uygulamaların bu yapıyı kullanarak sunucu etkileşimine daha da önem vermesiyle AJAX’ın yaygınlaşması gün geçtikçe daha da arttı.
Google Maps Ajax
AJAX’a Bir Alternatif Var Mı?
Aralık 2009 yılına gelindiğinde WebSocket fikri duyuruldu. WebSocket ile birlikte HTTP (Hypertext Transfer Protocol)’un kullandığı “bağlan, iletişime geç ve bağlantıyı sonlandır” mekanizması artık “bağlan ve iki taraftan birisi (sunucu-istemci) bağlantıyı sonlandırana kadar iletişimi sıcak tut” sistemine geçti. Artık AJAX olmadan WebSocket ile web sayfalar yenilenmeden anlık ve dinamik olarak sunucu-istemci iletişimi sağlanabilir oldu.
AJAX İle HTTP İsteği Nasıl Yapılır?
AJAX ile HTTP isteği gerçekleştirmeye başlamadan önce XMLHttpRequest nesnesininin bir örneğini (instance) oluşturuyoruz.
httpRequest = new XMLHTTPRequest();
HTTP isteğini göndermeden önce isteğe gelecek cevabı dinleyeceğimiz fonksiyonu çağıracağız.
httpRequest.onreadystatechange = function() {
// Sunucudan gelecek cevabın yorumlanmasını ve işleme alınmasını burada gerçekleştirebilirsiniz.
};
Bunun ardından bir istek gönderebiliriz.
httpRequest.open(“GET”, “ , true);
httpRequest.send();
Yukarıdaki örneğe yakından göz attığımızda Ziyaretçiler için gizlenmiş link,görmek için Giriş yap veya üye ol. web sitesine bir HTTP GET isteği gönderdiğimizi görüyoruz. Fonksiyonun aldığı 3’üncü parametre olan true ile Javascript kodlarının çalıştırılmasının asenkron hale gelmesini sağlıyoruz. Böylelikle HTTP isteğimize cevap alana kadar rahatça web sayfayı kullanmaya devam edebiliriz.
Bunlara ek olarak HTTP isteği gönderirken HTTP başlığı da yapabilmek mümkün.
httpRequest.setRequestHeader(“Content-Type”, “text/html”);