Kayıt Ol

Giriş

Şifremi Kaybettim

Lost your password? Please enter your email address. You will receive a link and will create a new password via email.

Giriş

Kayıt Ol

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi adipiscing gravdio, sit amet suscipit risus ultrices eu. Fusce viverra neque at purus laoreet consequa. Vivamus vulputate posuere nisl quis consequat.

Android Jsoup ile HTML Parsing

Merhaba arkadaşlar,  Bugün sizlere Jsoup kütüphanesi kullanımı ile HTML parse işleminin nasıl gerçekleştirileceğini anlatacağım. HTML Parse , HTML ayrıştırma anlamına gelmektedir.   Herhangi bir Html sayfasından istediğimiz yerleri alabilir ve uygulamalarımızda kullanabiliriz. Örneğin web sitemizi , mobil uygulamaya dönüştürmek istiyoruz diyelim; web sitemizin html sayfasında bulunan tag leri ayrıştırarak verileri elde ederiz, bunu da uygulamamızda şekillendiririz.

Jsoup ise Java programlama diline ait açık kaynak kodlu html parser kütüphanesidir. Html element lerine ulaşmamız için bu kütüphaneyi kullanacağız , bu kütüphaneyi kullanabilmek için de projemize import etmemiz gerekiyor.

http://www.mobilhanem.com sitemizden bir kaç veri çekip uygulamamızda gösterelim Android Studio yu açıyoruz Gradle Scripts segmesinden build.gradle a aşağıdaki kodu yapıştırıyoruz, yapıştırdıktan sonra uygulamanızı  Rebuild project yapmayı unutmayın. Android Studio arka planda derleme işlemlerini tamamladıktan sonra artık Jsoup kütüphanemizi kullanabilir duruma geleceğiz.

Az çok web sayfası kavramından anlayanlarımız bilir ki html tag larını oluştururken id ler kullanabiliriz yada class tag ı vererek onun içinde şekillendirmeler yapabiliriz. Jsoup kütüphanesinin mantığı ise , istenilen url ye bağlantıyı gerçekleştirip , select komutu ile html tag lerine ulaşarak verileri elde etmemizi sağlamaktır. Internet üzerinden bu verilere ulaşmak istediğimiz için Async Task yapısını kullanacağız. Nasıl Json Parse işlemlerinde bu yapıyı kullanıyorsak, Html Parse yaparken de bu yapıyı kullanmamız doğru olacaktır.

url ye bağlantıyı şu şekilde sağlayacağız.

URL yazan kısma ulaşmak istediğimiz web sayfasının linkini vermemiz yeterli.

Daha sonra Html elemanlarına ulaşabilmek için belli başlı select komutları var onlardan ihtiyacımız olanları kullanacağız. Daha detaylı komutlara bakmak için tıklayınız.

html <div id=”yourDivName”> tag lerine ulaşabilmek için “#” kullanarak aşağıdaki gibi yazıyoruz.

html <div class=”yourClassName”> tagıne ulaşabilmek için “.” kullanarak aşağıdaki gibi yazıyoruz.

Yayınlamış olduğum Parse SDK ile Anlık Bildirim dersi sayfasından verileri çekeceğiz. Burada yer alan site başlığını , açıklamasını ve sitemizin logosunu çekmeye çalışalım. Uygulamamızda 4 adet buton bulunuyor. Bu butonların ne işe yaradığını kaynak kodların içinde yorum olarak belirttim.

activity_main.xml

 

MainAcitivity sınıfımız aşağıdadır.

MainActivity.java

MainActivity sınıfımızda yer alan kodları incelemeye başlayalım. Uygulamayı çalıştırdığınız zaman göreceksiniz ki ilk butona tıklandığı an ilgili sayfanın başlığını çekip ekrana yazdırıyoruz. Bunu FetchTitle ismini verdiğim methodu incelersek eğer Async Task yapısında bildiğiniz üzere ilk olarak onPreExecute methodu çalışıyor orada kullanıcıya mesajı gösteriyoruz ve hemen ardından çalışan doInBackground methodu ile ilgili url ye bağlanıyoruz. ( http://www.mobilhanem.com/parse-sdk-ile-anlik-bildirim-gonderme-push-notification/ )  bu sayfamızda çekmeye çalıştığımız başlık kısmına sayfanın source-code nu görüntüleyerek bakarsak eğer ; resimde de görüldüğü gibi title kısmında yer alan yazıyı onPostExecute methodunda TextView e yazdırdık.

resim_title

İkinci butona tıklandığı zaman ise FetchDescription isimli method çalışarak; ilgili sayfanın açıklaması çekilip ekrana yazdırılıyor. Yukarıda anlatmış olduğum yapı burası içinde geçerli bu yüzden tekrardan aynı şeylerden bahsetmeyeceğim. meta tagında yer alan description un content değişkenine  ulaştıktan sonra bunu TextView e yazdırıyoruz. Bu veriyi çektiğimiz ilgili sayfanın html görüntüsüne bakacak olursak ;

img_desc

Üçüncü butona tıklandığı zaman ise FetchImageLogo isimli method çalışarak; ilgili sayfanın logo su çekilip ekranda gösteriliyor. Bu dersimizin kaynak kodunu incelerseniz eğer, başka bir url segmesine bağlantıyı gerçekleştirdiğimi göreceksiniz. Burada ilgili web sayfalarının farklı kısımlarına da ulaşabileceğimizi göstermek istedim. Sayfanın logo sunu çekerken img[src] ifadesini kullandığımı göreceksiniz burada sayfanın kaynak resim dosyasını çekebilmemiz için gerekli olan bu kodu kullanarak, çekilen veriyi önce Bitmap e çevirip daha sonra ImageView e set ettik.  Logo yu çektiğimiz ilgili sayfanın html görüntüsüne bakacak olursak ;

 

img_logo_new

ve son olarak dördüncü butona basıldığında FetchYazarlar methodunu çağırdık burada yine ilgili web sitesinin başka bir sayfasına bağlantıyı gerçekleştirdik ve yazarlar bölümünü çekip ekrana yazdırdık. Zaten bağlantıyı kurduğumuz url yi görüntüleyecek olursanız class adının post-content verildiğini göreceksiniz, div[class=post-content] komutunu kullanarak gerekli işlemleri gerçekleştirdik. Yazarlar kısmını çektiğimiz ilgili sayfanın html görüntüsüne bakacak olursak ;

img_yazarlar

Html parse nasıl yapılır böylece sizlere göstermiş oldum, gerçekten çok kullanışlı ve  biraz html bilginiz var ise bunu Android ile birleştirip işinize yarayabilecek işlemleri kolayca gerçekleştirebilirsiniz. Jsoup mantığını ilerletmek istiyorsanız eğer uygulamalarınızda kullanmadan önce online-tool kullanarak alıştırmalar yapabilirsiniz.     ( http://try.jsoup.org/~iayWCMYVlvXEUrAws7ziRaMU3bM ) Kullanmak istediğiniz web sayfasına gelip sağ tıklayarak Inspect Element deyin ve html kodlarını seçip bu online-tool a yapıştırın. Daha sonrasında Jsoup daki Select komutlarını kullanmaya çalışın gerçekten çok işinize yaradığını göreceksiniz.

Ders hakkında soru ve önerilerinizi çekinmeden yorum bırakabilirsiniz. Bol Android’li günler sizin olsun :)

Sizlerden ricamız facebook.com/mobilhanem sayfamızı beğenmenizdir. Diğer dersimde görüşmek üzere kendinize iyi bakın..

Yazar Hakkında

Yüksek Lisans: Çankaya Üniversitesi / Bilgisayar Mühendisliği Lisans: Çankaya Üniversitesi / Bilgisayar Mühendisliği (4/3.30) (2010-2014) Lisans : Viyana Teknik Üniversitesi / Bilgisayar Bilimleri (2013)
  • Mustafa Tanca

    uzun bir aradan sonra yeni ders eklenmiş. gerçekten faydalı bir yazı olmuş teşekkürler

    • Alper Beyler

      yorum için teşekkür ederim bundan sonra yeni dersler yayınlamaya devam edeceğiz.

  • güzel makale, teşekkürler.

    • Alper Beyler

      çok saolun, iyi çalışmalar

  • Pingback: Android Studio Jsoup Kütüphanesi Ekleme | Mobilhanem()

  • Merhaba Alper Hocam,

    Jsoup ile bir html elementini başka bir element ile değiştirme işini nasıl yapabiliriz?

  • enscom10

    merhaba hocam benim bir uyglama oluşturdm webview birkaç menü ekledim fakat webview sayfa kaynak kodunu view-source kodlarını göstermiyor.aslında yapmak istedigim şu webviev da herhangi bir linkle tıklandıgında o linki otomatik kopyalamak yardımcı olursanız sevinirim.

    • enscom10

      yanlı resmi yükledim özür diliyorum bu hatayı çözmüştüm.

  • haldun

    merhaba hocam Document doc değeri debug esnasında sürekli null dönüyor bunun sebebi ne bir çözüm bulamadım cevaplarsanız sevinirim

    • Alper Beyler

      bu dersin kaynak kodlarını indirip denediğinizde mi null geliyor ? null gelmemesi lazım bu yazdığım derste verileri düzgün basıyor ekrana. internet ayarları yada verdiğiniz url yi kontrol eder misiniz

    • kemal

      Manifest dosyasında internet erişimi izni vermelisiniz

  • kemal

    Merhaba sizin jsoup dersinizi inceledim elinize sağlıkyalnız form elementi nasıl çekilir bulamadım. textbox button filan yardımcı olabilir misiniz ?

    • Alper Beyler

      merhabalar, formElement.select(“input[name=id]”).first() bu yapıda bir kod kullanmanız gerekmektedir form elementini çekebilmeniz için

      yukarıdaki örnek yapıya baktığımızda formElement.attr(“action”) dediğimizde deneme.php yı getirmesi gerekiyor. Verdiğim örnekleri dener misiniz ayrıca daha detaylı bilgi edinmek istersen jsoupun kendi sitesini incelemeni tavsiye ederim. ( http://jsoup.org/cookbook/extracting-data/dom-navigation )

  • ali

    HTML sayfasında birden çok title etiketine sahip veri varsa eğer, bu
    durumda Android uygulaması HTML sayfasındaki tüm title içeriklerini mi
    alıyor yoksa sadece HTML sayfasında ilk önce title etiketinin içeriğini
    alıp, diğerlerini almıyor mu? Bu sorunun cevabına ciddi anlamda çok
    ihtiyacım var.

    • Alper Beyler

      Merhabalar,
      Document doc = Jsoup.connect(URL).get();
      title = doc.title(); // burada url sini verdiğiniz ilgili web sayfasının başlığı ne ise onu alıyoruz bütün hepsini çekmiyor

  • İlker Oğuz

    resimleri çekmiyo yukarda gösterilen gibi yaptım ama olmuyo bi yardımcı olursanız sevinirim

    • Alper Beyler

      Merhaba, ilgili kaynak kodu indirip denediniz mi ? bu derste kullanılan url lere dikkat et farklı bir url de işlem yapıyorsan o zaman işler değişir..

      • İlker Oğuz

        Bi tek gosterimde sıkıntı cıkarıyor url felan alıyor ama gostermiyor baska kodu varmı aceba

        • emre

          bunu ekledin mi manifest e?

    • gnykspr

      resimleri göstermesi için picasso kullanabilirsin.

  • Yunus Karadağ

    S.a
    Anlatım için teşekkür ederim çok yardımcı oldu.
    Bir sorum olacaktı;
    ben logo çeker gibi yüklenen sayfanın içindeki linkleri almak istiyorum.
    bunun için ;
    Elements elements = doc.select(“a[href]”);
    title = elements.attr(“href”);
    şeklinde kullandım ve sayfanın içindeki ilk linki alıyorum fakat bütün linkleri almak için döngü içine almam gerek .Sayfa içindeki bütün linkleri alıp istediğim link adresini bulunca click yaptırtmak istiyorum yardımcı olabilirmisiniz ?
    Şimdiden teşekkür ederim.İyi çalışmalar.

  • Ferdi

    Merhabalar, Ben wp sitenin belli bir tag aralığını resimleriyle birlikte css kodları ve javascript kodları çalışacak şekilde nasıl çekebilirim ?
    Hızlı çekmek için en iyi yöntem nedir. Teşekkür ederim

    • Yukarıdaki ders zaten bunu anlatıyor. Sitenn wp olması farketmez.

      • Ferdi

        Siz beni anlamadınız sanırım. Tmm yukardaki örnek de bunu anlatıyor ama şöyle bir durum var; Ben belirttiğim tag arasındaki sadece yazıyı veya sadece resimi almak yerine ikisini de aynı anda almak istiyorum. Mesela div class.haberler olan taglarımı bir döngü yardımıyla kaç haber varsa o haberler hakkında tüm veriyi çekmek istiyorum ama bazılarında video olabilir olmayabilir de. Bunu nasıl ayarlayabilirim? Anlatabildim mi?

  • ali

    Merhabalar, kaynak kodlarını almak istediğim site girişte şifre ile destekli , bu şifre alanını nasıl doldurup asıl sayfa kaynak dosyasına ulaşabilirim yardımcı olursanız çok sevinirim..

  • orçun

    neden paylaşımların sonuna ss koymuyorsunuz çok daha etkili içerik olur.

    • Evet haklısın yeni derslerimizde çalışan hallerinin videolarını koymaya çalışıyoruz. Teşekkürler.

  • Yakup Yazar

    internet bağlantısının olmadığı lokal netwroklerde kullanabiliyor muyuz jsoup u ? Çekeceğim veri tamamen xml’den oluşmakta. Jsoup internet bağlantısı olmayan local networklerde kullanılamıyorsa, başka bir tavsiyeniz var mı?

    • Alper Beyler

      Merhaba ne yazık ki kullanamazsınız internet bağlantısı olması gerekiyor. burada da sizin sorduğunuz soruyu sormuşlar incelemeniz faydalı olacaktır.

      • Yakup Yazar

        Size sorduktan sonra denedim, internet bağlantısı olmadan da çekti. Ama Siz böyle cevap verince bi şaşırdım. Neden çektiğini araştırıyorum şuan =)

  • Abdurrahman Tekin

    Ben Sitedeki dersleri çekmek istiyorum ve dersler video direk videonun başka bir pencere açmadan aynı pencerede izlemesini istiyorum bunu nasıl yapa bilirim lütfen yardımcı olurmusunuz

  • Ahmet Faruk Dursun