AJAX (Asynchronous JavaScript and XML) 1

AJAX web uygulamalarında sayfaların parçalı olarak çalışmasını sağlayan bir teknolojidir. Klasik yöntemde web sayfası sunucuya tamamen gönderilip sunucudan cevap olarak dönen web sayfasının yeni durumu tarayıcıya tamamen yüklenirken diğer yaklaşımda javascript aracılığıyla DOM (Document Object Model) kullanılarak ilgili değişikliklerin kısmı olarak yapılması sağlanmaktadır. Bu yazıda AJAX sorgularının Jquery ile w3schools'da yer alan örneği kullanarak nasıl çalıştığını açıklamaya çalışacağım. Aşağıdaki örnekte JSON nesnesi olarak name ve city paremetreleri gönderilmekte ve ASP sayfasından bu değerler okunup sonucu döndürülmektedir.



Bir network analiz aracı ile yaptığım analizde sorgunun paket yapısı aşağıdaki gibi gözlemlenmiştir. Görüntüde görüldüğü gibi istek HTTP protokolü ile POST yöntemi kullanılarak yapılmaktadır. Burada önemli noktalardan biri X-Requested-With başlığıdır. Bu başlığa XMLHttpRequest değeri atanarak ilgili isteğin bir AJAX isteği olduğu belirtilmektedir. Normal istekler ile AJAX istekleri arasındaki en önemli fark AJAX isteklerinin "redirect" yapılmamasıdır. Jquery ile gönderilen JSON nesnesinin HTTP protokolü içinde form element olarak taşınması bir diğer önemli noktadır. Görüntüde görüldüğü üzere mesaj yapısı "application/x-www-form-urlencoded" olarak görülmektedir. Mesaj parametre değerlerini içeren key-value ikililerinden oluşmaktadır.



Yapılan AJAX sorgusunda ASP sayfasından ilgili parametrelerin değerlerini de içeren bir yazı (text) döndürülmektedir. Bu durumu gösteren network paketi aşağıdaki gibidir. Görüldüğü üzere dönen mesajın türü text/html dir. Jquery tarafından bu değer "alert" olarak bize bildirilmektedir.



İletişim kurduğumuz ASP sayfasın aşağıdaki kod ile bize text bir değer döndürmektedir. Görüldüğü üzere yapılan istek  x-www-form-urlencoded türünde olduğu için Request.Form kullanılarak gönderilen parametrelere kolaylıkla ulaşılabilmektedir. 

<%
dim fname,city
fname=Request.Form("name")
city=Request.Form("city")
Response.Write("Dear " & fname & ". ")
Response.Write("Hope you live well in " & city & ".")
%>