|
|
|
Ajax ile Ado.Net Data Services Kardeşliği - Bölüm 1 |
|
| Gönderiliyor lütfen bekleyin... |
|
|
Bugün sizlerle Ado.Net Data Services
kullanarak veriye
asenkron olarak nasıl ulaşabileceğimize değinmeye çalışacağız. Başlamadan önce
bu teknolojinin ne olduğuna, hangi noktada işimize yarayabileceğine kısaca
değinelim.
Ado.Net Data Services ile Microsoft
bizlere; veri şemalarını(data schema) nesnelere dönüştürüp bunları servisler üzerinden kullanmamızı sağlayan bir yapı sağladı. Biz bu verilerle sunucuya istekte bulunarak
Atom veya Json(JavaScript Object Notation) formatlarında alabiliyoruz. Üstelik bu servisten istediğimiz verileri, belirttiğimiz sorgu cümlelerine göre de getirebilmekteyiz. Peki
tüm bunlar bize neler kazandırıyor? Kazandırdıkları yanında bizden alacağı şeyler nelerdir?
İster istemez kimilerinizin aklında bu sorular belirmeye başlamıştır bile. O zaman öncelikle Ado.Net Data Services'in bize neler kazandırdığından bahsedelim.
Bu arada yazının ilerleyen kısımlarında bu uzun yazımdan kurtularak Ado.Net Data Services'i kısaca ADS şeklinde
adlandıracağım.
Az önce de
belirttiğimiz gibi verileri Atom ve Json olarak alabiliyoruz. Özellikle Json formatında gelen bu verileri jQuery ile rahatlıkla alabilir ve istemci tarafında işleyebiliriz. Birde
Atom formatında gelen çıktı, Json formatında gelen çıktıdan daha büyük boyutta. Böyle bir durumda veriyi sunucudan
Json formatında istemek daha akıllıca bir seçenek olabilir. Diğer güzel bir tarafı ise
ADS, REST(Representational State Transfer) modele göre hizmet veren bir
servistir. Bu model ile sorgu cümlelerinini veri servisinin URL’inde belirtip; sonuç kümesini, yapılan sorgunun sonucuna göre alabiliyoruz. İstersek servis referansını kullanarak diğer bir projeden LINQ ile de veriyi isteyebilmekteyiz.
Bu seçimi yapmak yazılımcının inisiyatifine kalmış.
İsterseniz biraz da bize kaybettirdiği taraflardan bahsedelim. Bu konu, bu camiada pek bahis konusu olmasada; kusursuz hiçbir şey olmadığını hepimiz biliyoruz. Bu felsefeyle hareket ettiğimizde
ADS’ninde bizden aldığı birkaç şey var. Örnek vermek gerekirse çok büyük verilerde trafik üzerinde olumsuzluk yaratacağı kesin
bir sonuçtur. Bu yüzden ADS’yi küçük verileri çekmekte kullanabiliriz Bununla
birlikte kullanılan servis bir WCF servisi olduğu için güvenlik önemlerini almak
akıllıca olacaktır.
 |
WCF ile güvenliği sağlamak için Burak Selim Şenyurt'un
ilgili makalerine aşağıdaki linklerden erişebilirsiniz.
|
İsterseniz şimdi
ADS ile veriye Asp.Net Ajax kullanarak nasıl erişebileceğimiz ile ilgili bir örnek yapalım ve konuyu iyice pekiştirelim.
Yüzüğün Gücü : ADS ile Ajax Kardeşliği
Öncelikle
Visual Studio 2008’imizi açalım ve yeni bir web uygulaması yaratalım. Ben
yaratacağımız bu projeye "ADSIlkOrnek" ismini vereceğim. Projemize isim verip
oluşturduktan sonra Solution Explorer'dan proje ismine sağ tıklayıp Add New
Item'a basalım. Buradan projemize yeni bir
"Ado.Net Entity Data Model’ı ekleyeceğiz.
|
|
Ado.Net Entity Data Model; bağlanacak olduğumuz veritabanı üzerindeki
veri nesnelerine ait modelleri oluşturmamızda bize yardımcı olacak olan arabirim. |
Ekleme işlemini gerçekleştirdikten hemen sonra karşımıza bir sihirbaz gelecek.
İlk adımda kullanacağımız Entity Data Model'i oluşturacağımız seçenekler
sunuluyor. Biz hazır bir veritabanından oluşturacağımız için hiçbir değişiklik
yapmadan ileri butonuna basıyoruz. Sonraki adımda
kullanacağımız bir bağlantı eğer varsa bu bağlantıyı seçip devam ediyoruz. Eğer
yoksa yeni bir bağlantı oluşturup, gerekli ayarlamaları yapıp ileri butona
basıyoruz. Bir sonraki adımda
kullanacağımız veri nesnelerini(AdventureWorks içindeki Product ve ProductSubcategory tablolarını)
işaretleyip Model Namespace'imizide değiştirmeden Finish butonuna basıyoruz.
Entity Modelimizi oluşturduktan sonra projemize Ado.Net Data Service
isimli proje öğemizi ekliyoruz.
Sonrasında servis nesnemiz içerisinde aşağıdaki değişiklikleri yapıyoruz.
Burada öncelikle namespace kısmına AdventureWorksModel veri servisi nesnemizi ekliyoruz. Sonrasında sınıfın türetildiği DataService nesnesinin tipine AdventureWorksEntities isimli varlık nesnemizi yazıyoruz. Son olarakta veri servisine erişim ayarlamalarını yapıyoruz. Biz şimdilik
"AllRead" isimli erişim özelliğini seçili durumuna getirelim. Çünkü şu
an için sadece veriyi okuma işlemi yapacağız.Bir sonraki makalede CRUD(Create
Read Update Delete) işlemlerini ele alacağız ve burada
"All" özelliğini seçili duruma getirip okuma işlemlerinin yanı sıra
yazma işlemlerini de gerçekleştireceğiz. ADS'deki veri servisine erişebilmek için özel bir script dosyamız var. Öncelikle bu script dosyamızı indirelim ve proje içine ekleyelim.
( AJAX Client Library for ADO.NET Data Services )
Sonrasında bu JavaScript dosyasını ister Head tagları içerisinde, ister ScriptManager içerisinde referans
olarak ekleyebiliriz. Yalnız bunlardan bir tanesini seçmek zorundasınız. Resimdeki gibi ikisini birden yazıp hataya neden olmayalım :) Ben seçimimi ScriptManager şeklinde kullanmayı tercih ettim. Öyleyse devam edelim;
Şimdi markup kısımını biraz daha detaylandıralım sonrasında Data Service nesnemize bağlanmak için scriptimizi yazmaya başlayalım.
|
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
<Scripts>
<asp:ScriptReference Path="~/Scripts/DataService.js" />
</Scripts>
</asp:ScriptManager>
<div>
<input id="queryButton" type="button" value="Get Data" onclick="return queryButton_onclick()" /><br />
<ul id="resultList"></ul>
</div>
</form>
</body>
|
Veriye erişebilmek için javascript’imizi de yazalım;
|
<head runat="server">
<title></title>
<script language="javascript" type="text/javascript">
function queryButton_onclick() {
var adventureService = new Sys.Data.DataService("AdventureWorksDataService.svc");
adventureService.query("ProductSubcategory", cbSuccess, cbFailure);
}
function cbSuccess(result, context, operation) {
var resultList = document.getElementById(’resultList’);
for (var i in result) {
var thisCate = result[i];
var li = document.createElement(’li’);
li.appendChild(document.createTextNode(thisCate.Name));
resultList.appendChild(li);
}
}
function cbFailure(error, context, operation) {
alert("Error!");
}
</script>
</head>
|
Artık projemizi test etmeye başlayabiliriz. Ama test etmeden önce dilerseniz neler yaptığımıza bir göz atalım. Öncelikle bir html button koyduk. Bu
düğmeye basınca queryButton_onclick fonksiyonu ateşlenecek. Fonksiyon içerisinde ise DataService.js isimli javascript dosyamız sayesinde
veriye erişmek için bize yardımcı olacak olan metodu kullanıyoruz. Servis nesnemizi yarattıktan sonra bu nesne içerisindeki query isimli metot ile sorgumuzu gerçekleştirip veri talebimizi iletiyoruz. İlk parametre ile REST modele göre sorgumuzu yazıyoruz. Biz burada “ProductSubcategory” tablomuzun tamamını istiyoruz. İkinci paremetrede ise buraya işlemlerin başarılı olması halinde çalışacak olan callBack metodunu yazıyoruz. Başarısız olmasında ise 3. Parametre ateşlenecek ve buradaki callBack metodu çalıştırılmış olacak. Sıra F5’e basmaya geldi. Bakalım nasıl bir sonuç
gösterilecek.
Tam istediğimiz sonuçla karşılaştık ve bunu sayfamız postBack olmadan yaptık. Peki ya ilişkili iki tablomuz olsaydı nasıl
olacaktı. O zaman örneğimizi geliştirmeye devam edelim ve javascriptimizi biraz değişikliğe uğratalım.
|
<head runat="server">
<title></title>
<script language="javascript" type="text/javascript">
function queryButton_onclick() {
var adventureService = new Sys.Data.DataService("AdventureWorksDataService.svc");
adventureService.query("ProductSubcategory?$expand=Product&$top=5", cbSuccess, cbFailure);
}
function cbSuccess(result, context, operation) {
var resultList = document.getElementById(’resultList’);
for (var i in result) {
var thisCate = result[i];
var li = document.createElement(’li’);
li.appendChild(document.createTextNode(thisCate.Name));
var subResultList = document.createElement(’ul’);
for (var k in thisCate.Product) {
var thisProd = thisCate.Product[k];
var subLi = document.createElement(’li’);
subLi.appendChild(document.createTextNode(thisProd.Name + ’ : ’ + thisProd.Color));
subResultList.appendChild(subLi);
}
li.appendChild(subResultList);
resultList.appendChild(li);
}
}
function cbFailure(error, context, operation) {
alert("Error!");
}
</script>
</head>
|
İlk değişikliği sorgu cümlemizde fark edeceksiniz. Buradaki expand
anahtar sözcüğü ile ProductSubcategory nesnemiz içerindeki Product özelliğini genişletilmiş olarak talep ediyoruz. Sonra ikinci bir for ile Product nesnesi içerinde iterasyonu gerçekleştirip, alt bir sıralama yapıyoruz.
Evet bu makalemizde sizlerle Ado.Net Data Service üzerinden veriye Ajax ile ulaşıp, yazdığımız sorgular ile sonucu sunuma taşıdık.
Farklı bir konuda, farklı bir makalede görüşünceye dek esen kalın...
Örnek proje
Mehmet Gökay Okutucu
Email : [email protected]
Blog : http://gokayokutucu.blogspot.com
Makale:
Ajax ile Ado.Net Data Services Kardeşliği - Bölüm 1 .NET 3.0 ve .NET 3.5 Özel Bölümü Mehmet Gökay Okutucu
|
|
|
|
|
-
-
Eklenen Son 10
-
Bu Konuda Geçmiş 10
Bu Konuda Yazılmış Yazılmış 10 Makale Yükleniyor
Son Eklenen 10 Makale Yükleniyor
Bu Konuda Yazılmış Geçmiş Makaleler Yükleniyor
|
|
|