ionic-uzak-json-veri-cekme
a
Kadir KILIÇ
7 ay önce 23 Yorum

ionic Uzaktan Json Veri Çekme

Mobil uygulamalarda genellikle veritabanı yerine json kullanılır, bunun için ionic’te json kullanmak için ilk olarak ionic’te projemizi oluşturmamız gerekli(bkz: #1) daha sonra projemizi oluşturduğumuz klasörün içindeki index.html’ye aşağıdaki kodları eklememiz gerekli.

<div ng-controller="kodist">
<ion-item ng-repeat="i in item">
<td>{{i.plaka}}</td>
<td>{{i.sehir}}</td>
</ion-item>
</div>

Javascript kodlarınızı ise ister index.html’de “<script>” tagları arasına eklersiniz isterseniz de ayrı bir javascript dosyasına ekleyebilirsiniz.

var app = angular.module('starter', ['ionic']);
app.controller('kodist', function ($scope, $http){
$http.get('kodist.json').success(function(data){
$scope.item = data;
});
});

buradaki “kodist.json” yazan kısım sizin çekecek olduğunuz json dosyanızın adresidir, örnek json dosyamız bu şekildedir:

[
{
"plaka": "01",
"sehir": "Adana"
},
{
"plaka": "02",
"sehir": "Adıyaman"
},
{
"plaka": "03",
"sehir": "Afyon"
},
{
"plaka": "04",
"sehir": "Ağrı"
},
{
"plaka": "05",
"sehir": "Amasya"
}
]

NOT: Uygulamamızı denemek için cmd ekranına

ionic serve -l

yazarak uygulamanızın mobilde nasıl görüneceğine bakabilirsiniz.

json
NOT: Projenizi ionic ile geliştirmiyorsanız aşağıdaki script kodumunuzu head tagları arasına eklemelisiniz.

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>

Yazıda Geçen Linkler:
1- ionic Kurulumu

ionic Uzaktan Json Veri Çekme için Yorumlar
  • Avatar for Kadir KILIÇ Ahmet - 20.10.16 09:10

    Vertabani yerine json kullanilmaz cunku veritabani verileri tutar json icersine yazma cikarma yapmak anlamsiz mobil projelerde sqllite kullanilir genelde. Hangi durumlarda hson kullanilabilir ? Sabit degismeyen datalarda kullanmak mantiklidir. Sizin ornekte gosterdiginiz gbi.

    • Avatar for Kadir KILIÇ Can YİĞİTEROL - 20.10.16 11:10

      Json’u veri tabanı mantığı ile kullanabilirsiniz ama sınırlı alanlarda kendi projemde json’u veri tabanı gibi kullanıyor ve her gün üzerine veri yazdırıyorum.

  • Avatar for Kadir KILIÇ Ali - 29.11.16 08:11

    Uzak sunucuda günlük olarak güncellenen verileri bu metodla alıp sitede Dinamik olarak yayınlamak mümkünmüdür

    • Avatar for Kadir KILIÇ Kadir KILIÇ - 29.11.16 11:11

      Tabiki mümkündür.

  • Avatar for Kadir KILIÇ Ali - 29.11.16 11:11

    Yaklaşık 15 günden beri bir türlü başaramadım. 1 seneyi bulacak anlaşılan benim bunu yapmam 🙂

    • Avatar for Kadir KILIÇ Kadir KILIÇ - 30.11.16 01:11

      Takıldığınız aşamayı belirtirseniz yardımcı olmaya çalışırım 🙂

  • Avatar for Kadir KILIÇ Ali - 30.11.16 08:11

    json ve xml formatında uzak sunucuda bulunan verileri HTML sayfa içerisine aktaramadım bir türlü. PHP ile Verileri almayı başardım fakat php kodları .html uzantılı sayfalarda okunmadiği için kilitlendim kaldım.

    Örnek olarak aşağıdaki kod dreamweawerda çalışırken ekrana verileri yazıyor fakat html sayfa içinde çalışmıyor.

    $(document).ready(function () {
    var url = ‘https://www.mailadresinize attığım url :)’;
    $.getJSON(url, function (data) {
    for (var i = 0; i < data.length; i++) {
    if (data[i].dc_Ilce == "Ceyhan")
    if (data[i].dc_Il == "Adana")
    {
    document.write(data[i].dc_Eczane_Adi + "” + data[i].dc_Telefon + “” + data[i].dc_Adres + “” + data[i].dc_Ilce +””);
    }
    }
    });
    });

    Ayrıca aşağıdaki PHP kodla verileri ekrana yazabiliyorum fakat .html uzantısı olduğunda tarayıcı php kodlarını işlemediğinden çalışmıyor.

    $val){
    echo $val->dc_Il . ”;
    echo $val->dc_Ilce . ”;
    echo $val->dc_Eczane_Adi . ”;
    echo $val->dc_Telefon . ”;
    echo $val->dc_Adres . ”;
    echo $val->dc_Il_Plaka_Kodu . ”;
    echo ”;
    }

    Uzun lafın kısası Blogger tabalı sitede json ve xml formatındu uzak sunucuda bulunan verileri dinamik olarak yayınlayamıyorum. Blogger e 100 lerce script yükleniyo fakat ben yapamadım

    • Avatar for Kadir KILIÇ Kadir KILIÇ - 01.12.16 09:12

      Yazdıklarınızdan çıkartığım blogger tabanlı bir sitede yazdığınız kodları çalıştırmak fakat PHP blogger’da çalışmamaktadır, fakat yazımızda bulunan kodları ekleyerek çalıştırabilirsiniz.

  • Avatar for Kadir KILIÇ Ali - 01.12.16 10:12

    Teşekkür ederim. Php ile çekip iframe ile bloggere eklemeye karar verdim. Verdiğiiniz kodları düzenleyebilem imkansıza yakın. KOd bilgim yok denecek kadar az.

  • Avatar for Kadir KILIÇ Halis - 14.02.17 12:02

    merhabalar uzaktan başka bir siteden json kullanmaya çalıştığımda hata veriyor yardımcı olur musunuz?
    Hata :
    XMLHttpRequest cannot load http://site-adresi/kadro.json. No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://localhost:8100’ is therefore not allowed access.

  • Avatar for Kadir KILIÇ Halis - 21.02.17 01:02

    Merhabalar verilen çözüm sorunu çözdü ama bir sorum daha olacaktı yardımcı olabilirseniz??
    Şimdi verileri json ile aldım. ben liste yapmak istiyorum ancak listede ögeye tıklayınca o ögenin açıklamasını göstermek istiyorum. jsonda var o veri. Şimdi onu nasıl yapabilirim? yani orada json içinden nasıl alabilirim açıklamayı? örneğini listede {{i.plaka}} diyorum ama ögeye tıklayınca hangi ögeyse o ögenin açıklaması gelecek? Bu nasıl olabilir? Şimdiden teşekkürler..

    • Avatar for Kadir KILIÇ Kadir KILIÇ - 22.02.17 09:02

      anladığım kadarıyla, “ionic parameters” şeklinde arama yaparsanız bulabilirsiniz.

  • Avatar for Kadir KILIÇ Halis - 21.02.17 02:02

    bir de json kullanmak için illa dosya uzantısı json mu olmalı?
    yani wordpress sitede ki herhangi bir sayfayı json olarak tanıtamaz mıyız ionic e?

    • Avatar for Kadir KILIÇ Kadir KILIÇ - 22.02.17 09:02

      hayır, dosya uzantısı farketmez sadece o sayfadaki içeriğin json olması yeterli, örnek bkz: https://www.w3schools.com/js/showphp.asp?filename=demo_file_array

  • Avatar for Kadir KILIÇ Halis - 21.02.17 12:02

    json dosya ile video çekmek mümkün mü?

    • Avatar for Kadir KILIÇ Kadir KILIÇ - 22.02.17 09:02

      tabiki çekmek mümkün;

      <iframe width="420" height="315" src="{{i.videolinki}}"></iframe>

      şeklinde basitce çekebilirsiniz.

  • Avatar for Kadir KILIÇ Halis - 24.02.17 01:02

    Çözümler işe yaradı ancak hocam video çekerken youtube ile ilgili bir problem oluyor. hata şu :
    ” XMLHttpRequest cannot load https://googleads.g.doubleclick.net/pagead/id. The value of the ‘Access-Control-Allow-Origin’ header in the response must not be the wildcard ‘*’ when the request’s credentials mode is ‘include’. Origin ‘https://www.youtube.com’ is therefore not allowed access. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.”
    Daha önce öenrmiş olduğunuz chrome eklentisi kurulu ve açık. Teşekkürler

    • Avatar for Kadir KILIÇ Can YİĞİTEROL - 24.02.17 10:02

      Hatanın sebebi ise o eklenti yani onu kullanırken malesef diğer sekmelerde sorun oluşuyor bunu önüne geçmedik biz de.

  • Avatar for Kadir KILIÇ Halis - 25.02.17 11:02

    teşekkürler hocam. bnde hala arıyorum bir çzöüm. hataya rağmen çalışıyor. teşekkürler yardımlarınız için

  • Avatar for Kadir KILIÇ Halis - 15.03.17 12:03

    hocam merhabalar yardım edebilir msnz? yapamadm?
    şimdi json detay sayfası yapmaya çalışıyorum ama olmuyor detay göndermiyor yani sayfayı görmüyor? yani şehirlerden birine tıklayınca onunla ilgili detayların bulunduğu bir sayfa açılacak bu nasıl olacak? yapamadım bir türlü? yardım edebilir msnz?

    • Avatar for Kadir KILIÇ Kadir KILIÇ - 19.03.17 02:03

      uygulamanızı “ionic start myApp side” şeklinde oluşturduğunuzda bu istediğiniz örnekli bir şekilde gelmekte üzerinde düzenleme yaparak istediğinizi elde edebilirsiniz.

  • Avatar for Kadir KILIÇ Halis - 02.05.17 01:05

    Merhabalar hocam yardımlar için teşekkürler bir sorum daha olacaktı sizlere.
    verdiğiniz örnek te json dosyası
    [
    {
    “plaka”: “01”,
    “sehir”: “Adana”
    },
    {
    “plaka”: “02”,
    “sehir”: “Adıyaman”
    },
    {
    “plaka”: “03”,
    “sehir”: “Afyon”
    },
    {
    “plaka”: “04”,
    “sehir”: “Ağrı”
    },
    {
    “plaka”: “05”,
    “sehir”: “Amasya”
    }
    ] bu tür dosyalarda çekme oluyor
    ancak json dosyasının başında [] olmadığı zaman nasıl çekme yapacağız? çekemedim bir türlü yardımcı olabilir msnz?