Bab 7 eXtensible Markup Languange(XML) A. T U J U A N : 1. Mempelajari dan mempraktekan tag-tag bahasa XML untuk pertukaran informasi pada sistem berbeda pada jalur internet. 2. Dapat membuat analisa pada masing-masing syntax XML yang diberikan. B. DASAR TEORI : XML adalah singkatan dari eXtensible Markup Language. Bahasa markup adalah sekumpulan aturan-aturan yang mendefinisikan suatu sintaks yang digunakan untuk menjelaskan, dan mendeskripsikan teks atau data dalam sebuah dokumen melalui penggunaan tag. Bahasa markup lain yang populer seperti HTML, menggambarkan kepada browser web tentang bagaimana menampilkan format teks, data, dan grafik ke layar komputer ketika sedang mengunjungi sebuah situs web. XML adalah sebuah bahasa markup yang digunakan untuk mengolah meta data (informasi tentang data) yang menggambarkan struktur dan maksud/tujuan data yang terdapat dalam dokumen XML, namun bukan menggambarkan format tampilan data

tersebut. XML adalah sebuah standar

sederhana yang digunakan untuk medeskrippsikan data teks dengan cara selfdescribing (deskripsi diri). XML juga dapat digunakan untuk mendefinisikan domain tertentu lainnya, seperti musik, matematika, keuangan dan lain-lain yang menggunakan bahasa markup terstruktur. Berikut ini adalah contoh sebuah dokumen XML untuk informasi contact person: Yadi Utama PT. Gamatechno Indonesia

Jl. Cik Di Tiro No.34

Yogyakarta <state>Indonesia 55284 081328462499 <email>[email protected]

Perhatikan bagaimana mudahnya untuk mengerti tentang makna informasi dan strukturnya pada dokumen XML di atas, sehingga juga akan mudah bagi komputer untuk mengerti dokumen XML ini. Seperti halnya HTML, XML juga menggunakan elemen yang ditandai dengan tag pembuka (diawali dengan ‘<’ dan diakhiri dengan ‘>’), tag penutup(diawali dengan ‘’) dan atribut elemen(parameter yang dinyatakan dalam tag pembuka misal

). Hanya bedanya, HTML medefinisikan dari awal tag dan atribut yang dipakai didalamnya, sedangkan pada XML kita bisa menggunakan tag dan atribut sesuai kehendak kita. Berikut ini adalah tampilan dokumen XML di atas apabila dijalankan pada sebuah browser:

Gambar 7.1 Tampilan Dokumen XML pada browser

Berikut ini adalah contoh sebuah struktur dokumen XML: Elemen root Andi Yadi Utama <subject>Hallo <message>Selamat Pagi…

Standard Header

<email>

Elemen child

Baris pertama pada dokumen XML di atas adalah deklarasi standar header yang mendefinisikan versi XML dan karakter encoding yang digunakan dalam

dokumen XML. Dalam dokumen ini, XML mengacu pada versi 1.0 dan menggunakan standar encoding karakter set ISO-8859-1 (Latin-1/West European). Baris

selanjutnya

menggambarkan

elemen

induk

(root)

dokumen

“<email>..”, sebagaimana kita menyebut bahwa “Dokumen ini adalah sebuah Email”. Kemudian baris ke 3-6 menggambarkan elemen anak (child) dari elemen induk dokumen. Tag pada dokumen XML bersifat case sensitif di mana tag pembuka dan tag penutup harus ekivalen. Seperti contoh tag pembuka “<email>” harus ditutup dengan tag “”. Berikut ini adalah contoh penulisan dokumen XML yang tidak benar: “<email>….” “<email>….” “<Email>….” Berikut ini adalah contoh penulisan dokumen XML yang benar: “<email>….” “<EMAIL>….” “<Email>….” Karena XML bersifat mudah untuk dibaca dan ditulis baik oleh manusia maupun komputer, maka XML merupakan sebuah format yang dapat digunakan untuk pertukaran data (interchange) antar aplikasi dan platform yang berbeda (platform

independent).

Metode

deskripsi

data

XML

(self-describing)

membuatnya menjadi pilihan efektif untuk bisnis ke bisnis, solusi antar jaringan, e-business, dan aplikasi terdistribusi. XML juga bersifat dapat diperluas (extensible), dapat digunakan pada semua bahasa pemrograman, dan datanya dapat ditransfer dengan mudah melalui protokol standar internet seperti HTTP tanpa dibatasi oleh firewall. 

Bagaimana XML Dapat Digunakan? Pada penjelasan sebelumnya, diberikan contoh sebuah dokumen XML yang

berisi data contact person yang terdiri dari elemen “name”, “company”, “address”, “city”, “state”, “zip”, “phone”, dan “email”. Tidak seperti HTML, data-data dalam dokumen XML tidak dapat ditampilkan dalam format tampilan tertentu yang kita inginkan dalam browser web. Namun XML dapat dimanipulasi sebagai “pulau data” untuk ditampilkan pada browser web melalui HTML sesuai dengan format

tampilan yang diinginkan: <xml id="contact-person"> Yadi Utama PT. Gamatechno Indonesia

Jl. Cik Di Tiro No.34

Yogyakarta <state>Indonesia 55284 081328462499 <email>[email protected]

Dokumen XML ini dapat digabungkan dengan HTML untuk ditampilkan dalam sebuah browser web dengan membangun sebuah tabel dalam kode HTML dan mengasosiasikan nilai pada kolom-kolomnya dengan data dari elemen-elemen XML tersebut: <xml id="contact-person"> Yadi Utama PT. Gamatechno Indonesia

Jl. Cik Di Tiro No.34

Yogyakarta <state>Indonesia 55284 081328462499 <email>[email protected]

Name	<span datafld="name">
Company	<span datafld="company">
Address	<span datafld="address">
City	<span datafld="city">
State	<span datafld="state">
ZIP	<span datafld="zip">
Phone	<span datafld="phone">
Email	<span datafld="email">

Ketika ditampilkan melalui browser web, Anda akan melihat tampilannya

sepeti ini:

Gambar 7.2 Dokumen XML yang digabung dalam HTML

XML dikembangkan mulai tahun 1996 dan mendapatkan pengakuan dari W3C pada bulan Februari 1998. Teknologi yang digunakan pada XML sebenarnya bukan teknologi baru, tapi merupakan turunan dari SGML yang telah dikembangkan pada awal 80-an dan telah banyak digunakan pada dokumentasi teknis proyek-proyek berskala besar. Ketika HTML dikembangkan pada tahun 1990, para penggagas XML mengadopsi bagian paling penting pada SGML dan dengan berpedoman pada pengembangan HTML menghasilkan markup language yang tidak kalah hebatnya dengan SGML. Seperti halnya HTML, XML juga menggunakan elemen yang ditandai dengan tag pembuka (diawali dengan ‘<’ dan diakhiri dengan ‘>’), tag penutup(diawali dengan ‘’) dan atribut elemen(parameter yang dinyatakan dalam tag pembuka misal ). Hanya bedanya, HTML medefinisikan dari awal tag dan atribut yang dipakai didalamnya, sedangkan pada XML kita bisa menggunakan tag dan atribut sesuai kehendak kita. Untuk lebih jelasnya lihat contah dibawah:

MIS Manager HRD Manager Bagian rekrut Computer Suport team <subyek>Permohonan Tenaga kerja baru Mohon diberikan tenaga kerja baru untuk mengisi lowongan di Departemen MIS

Pada contoh diatas , ,dan bukanlah tag standard yang telah di tetapkan dalam XML. Tag-tag itu kita buat sendiri sesuai keinginan kita. Sampai di sini XML tidak melakukan apapun. Yang ada hanyalah informasi yang di kemas dengan tag-tag XML. Kita harus membuat software lagi untuk mengirim, menerima atau menampilkan informasi di dalamnya.

Gambar 7.3 Tampilan dokumen XML pada browser 

Kenapa Harus Menggunakan XML? XML untuk saat ini bukan merupakan pengganti HTML. Masing-masing

dikembangkan untuk tujuan yang berbeda. Kalau HTML digunakan untuk menampilkan informasi dan berfokus pada bagaimana informasi terlihat, XML mendeskripsikan susunan informasi dan berfokus pada informasi itu sendiri. XML terutama dibutuhkan untuk menyusun dan menyajikan informasi dengan format yang tidak mengandung format standard layaknya heading, paragraph, table dan lain sebagainya.

Sama dengan HTML, File XML berbentuk teks sehingga bila diperlukan kita bisa membacanya tanpa memerlukan bantuan software khusus. Hal ini memudahkan pengembang aplikasi yang menggunakan XML untuk mendebug programnya. XML lebih fleksible dibanding HTML dalam hal kemampuannya menyimpan informasi dan data. Pada XML kita bisa menyimpan data baik dalam atribut maupun sebagai isi elemen yang diletakkan diantara tag pembuka dan tag penutup. Kelebihan lain yang dimiliki XML adalah bahwa informasi bisa di pertukarkan dari satu system ke system lain yang berbeda platform. Misalnya dari Windows ke Unix, atau dari PC ke Machintosh bahkan dari internet ke handphone dengan teknologi WAP. 

Bagian-Bagian dari Dokumen XML Sebuah dokumen XML terdiri dari bagian bagian yang disebut dengan node.

Node-node itu adalah: 

Root node yaitu node yang melingkupi keseluruhan dokumen. Dalam satu dokumen XML hanya ada satu root node. Node-node yang lainnya berada di dalam root node.



Element node yaitu bagian dari dokumen XML yang ditandai dengan tag pembuka dan tag penutup, atau bisa juga sebuah tag tunggal elemen kosong seperti . Root node biasa juga disebut root element



Attribute note termasuk nama dan nilai atribut ditulis pada tag awal sebuah elemen atau pada tag tunggal.



Text node, adalah text yang merupakan isi dari sebuah elemen, ditulis diantara tag pembuka dan tag penutup



Comment node adalah baris yang tidak dieksekusi oleh parser



Processing Instruction node, adalah perintah pengolahan dalam dokumen XML. Node ini ditandai awali dengan karakter . Tapi perlu diingat bahwa header standard XML bukanlah processing instruction node. Header standard bukanlah bagian dari hirarki pohon dokumen XML.



NameSpace Node, node ini mewakili deklarasi namespace

Standard Header <Buku Judul=”Teknik Membangun Web Service Dengan Menggunakan SOAP dan WSDL” Penulis=”Yadi Utama”> Pengantar XML Web Service SOAP . . . Attribut e Root Node



Elemen kosong Comment

Sintaks XML Dibandingkan dengan HTML, XML lebih cerewet. Kalau kita menulis

sebuah dokumen HTML, beberapa kesalahan penulisan masih ditolerir. Misalnya kita menempatkan tag bersilangan seperti

Huruf Tebal

meskipun tidak dianjurkan, HTML masih bisa bekerja dan menampilkan hasil seperti yang kita inginkan. Tidak demikian dengan XML. Lebih jelasnya kita akan bahas di bawah ini tentang bagaimana membuat dokumen XML yang baik.

C. LANGKAH-LANGKAH & PERCOBAAN : 1. Anda harus menyiapkan web server, anda boleh memakai web server apache atau IIS. 2. Letakkan dokumen anda pada dokumen root dari web server yang anda pakai, sebagai contoh : dokumen root web server Apache dengan sistem operasi windows

berada

pada

folder

:

C:\Program

Files\Apache

Group\Apache\htdocs 3. Tulis kode-kode RSS berikut ini kedalam Notepad, simpan dalam extensi html atau htm dan kemudian letakkan kedalam direktori root web server anda. Kemudian panggil file tersebut dengan cara sebagai berikut :

http:\\localhost\nama_file.html atau http:\\Ipaddresskomputeranda\nama_file.html atau http:\\namaKomputerAnda\nama_file.html. 4. Cobalah skrip-skrip dibawah ini : 1. Percobaan 1 (view xml)  Source code Note.xml : <note> Tove Jani Reminder Don't forget me this weekend!

2. Percobaan 2 (View XML)  Source Code Error_note.xml : <note> Tove Jani Reminder Don't forget me this weekend!

3. Percobaan 3 (View XML)  Source Code Cd_catalog.xml : <TITLE>Empire Burlesque Bob Dylan USA Columbia 10.90 1985 <TITLE>Hide your heart Bonnie Tyler UK CBS Records

9.90 1988 <TITLE>Greatest Hits Dolly Parton USA RCA 9.90 1982 <TITLE>Still got the blues Gary Moore UK Virgin records 10.20 1990 <TITLE>Eros Eros Ramazzotti EU BMG 9.90 1997 <TITLE>One night only Bee Gees UK Polydor 10.90 1998 <TITLE>Sylvias Mother Dr.Hook UK CBS 8.10 1973 <TITLE>Maggie May Rod Stewart UK Pickwick 8.50 1990

<TITLE>Romanza Andrea Bocelli EU Polydor 10.80 1996 <TITLE>When a man loves a woman Percy Sledge USA Atlantic 8.70 1987 <TITLE>Black angel Savage Rose EU Mega 10.90 1995 <TITLE>1999 Grammy Nominees Many USA Grammy 10.20 1999 <TITLE>For the good times Kenny Rogers UK Mucik Master 8.70 1995 <TITLE>Big Willie style Will Smith USA Columbia 9.90 1997

<TITLE>Tupelo Honey Van Morrison UK Polydor 8.20 1971 <TITLE>Soulsville Jorn Hoel Norway WEA 7.90 1996 <TITLE>The very best of Cat Stevens UK Island 8.90 1990 <TITLE>Stop Sam Brown UK A and M 8.90 1988 <TITLE>Bridge of Spies T'Pau UK Siren 7.90 1987 <TITLE>Private Dancer Tina Turner UK Capitol 8.90 1983 <TITLE>Midt om natten Kim Larsen

EU Medley 7.80 1983 <TITLE>Pavarotti Gala Concert Luciano Pavarotti UK DECCA 9.90 1991 <TITLE>The dock of the bay Otis Redding USA Atlantic 7.90 1987 <TITLE>Picture book Simply Red EU Elektra 7.20 1985 <TITLE>Red The Communards UK London 7.80 1987 <TITLE>Unchain my heart Joe Cocker USA EMI 8.20 1987 4. Percobaan 4 (XML dengan DTC internal)  Source Code Note_in_dtc.xml :

]> <note> Tove Jani Reminder Don't forget me this weekend!

5. Percobaan 5 (XML dengan DTC eksternal)  Source code Note.dtc : ]> 

Source Code Note_ex_dtc.xml :

<note> Tove Jani Reminder Don't forget me this weekend!

6. Percobaan 6 ( Microsoft XML parser)  Source code xml_note.xml : <note> Tove Jani Reminder

Don't forget me this weekend! <script type="text/javascript"> 

Source code xml_note1.html : <script type="text/javascript"> var xmlDoc = new ActiveXObject("Microsoft.XMLDOM") xmlDoc.async="false" xmlDoc.load("xml_note.xml") document.write ("The first XML element in the file contains: ") document.write (xmlDoc.documentElement.childNodes.item(0).text)



Source code xml_note2.html : <script type="text/vbscript"> set xmlDoc=CreateObject("Microsoft.XMLDOM") xmlDoc.async="false" xmlDoc.load("xml_note.xml") document.write("

Traversing the XML nodes

") for each x in xmlDoc.documentElement.childNodes document.write("" & x.nodename & "") document.write(": ") document.write(x.text) document.write("

") next



Source code xml_note3.html : <script type="text/javascript" for="window" event="onload"> var xmlDoc=new ActiveXObject("Microsoft.XMLDOM") xmlDoc.async="false" xmlDoc.load("xml_note.xml") nodes=xmlDoc.documentElement.childNodes to.innerText= nodes.item(0).text from.innerText= nodes.item(1).text header.innerText=nodes.item(2).text body.innerText= nodes.item(3).text

W3Schools.com Internal Note

To: <span id="to">
From: <span id="from">

---

<span id="header">

---

<span id="body">

7. Percobaan 7 (XML dengan CSS)  Source Code Cd_catalog.css : CATALOG { background-color: #ffffff; width: 100%; } CD

{ display: block; margin-bottom: 30pt; margin-left: 0; } TITLE { color: #FF0000; font-size: 20pt; } ARTIST { color: #0000FF; font-size: 20pt; } COUNTRY,PRICE,YEAR,COMPANY { display: block; color: #000000; margin-left: 20pt; } 

Source Code cd_catalog_with_css.xml :

<TITLE>Empire Burlesque Bob Dylan USA Columbia 10.90 1985 <TITLE>Hide your heart Bonnie Tyler UK CBS Records 9.90 1988 <TITLE>Greatest Hits Dolly Parton USA RCA 9.90

1982 <TITLE>Still got the blues Gary Moore UK Virgin records 10.20 1990 <TITLE>Eros Eros Ramazzotti EU BMG 9.90 1997 <TITLE>One night only Bee Gees UK Polydor 10.90 1998 <TITLE>Sylvias Mother Dr.Hook UK CBS 8.10 1973 <TITLE>Maggie May Rod Stewart UK Pickwick 8.50 1990 <TITLE>Romanza Andrea Bocelli EU Polydor 10.80 1996

<TITLE>When a man loves a woman Percy Sledge USA Atlantic 8.70 1987 <TITLE>Black angel Savage Rose EU Mega 10.90 1995 <TITLE>1999 Grammy Nominees Many USA Grammy 10.20 1999 <TITLE>For the good times Kenny Rogers UK Mucik Master 8.70 1995 <TITLE>Big Willie style Will Smith USA Columbia 9.90 1997 <TITLE>Tupelo Honey Van Morrison UK Polydor 8.20 1971 <TITLE>Soulsville

Jorn Hoel Norway WEA 7.90 1996 <TITLE>The very best of Cat Stevens UK Island 8.90 1990 <TITLE>Stop Sam Brown UK A and M 8.90 1988 <TITLE>Bridge of Spies T`Pau UK Siren 7.90 1987 <TITLE>Private Dancer Tina Turner UK Capitol 8.90 1983 <TITLE>Midt om natten Kim Larsen EU Medley 7.80 1983 <TITLE>Pavarotti Gala Concert Luciano Pavarotti UK

DECCA 9.90 1991 <TITLE>The dock of the bay Otis Redding USA Atlantic 7.90 1987 <TITLE>Picture book Simply Red EU Elektra 7.20 1985 <TITLE>Red The Communards UK London 7.80 1987 <TITLE>Unchain my heart Joe Cocker USA EMI 8.20 1987 8. Percobaan 8 (XML dengan XSL) 

Source Code simple.xsl : <xsl:for-each select="breakfast_menu/food">

<span style="font-weight:bold;color:white"> <xsl:value-of select="name"/> - <xsl:value-of select="price"/>

<xsl:value-of select="description"/> <span style="font-style:italic"> (<xsl:value-of select="calories"/> calories per serving)



Source code simplexsl.xml : Belgian Waffles <price>$5.95 <description>two of our famous Belgian Waffles with plenty of real maple syrup 650 Strawberry Belgian Waffles <price>$7.95 <description>light Belgian waffles covered with strawberries and whipped cream 900 Berry-Berry Belgian Waffles <price>$8.95 <description>light Belgian waffles covered with an assortment of fresh berries and whipped cream 900 French Toast <price>$4.50 <description>thick slices made from our homemade sourdough bread 600

Homestyle Breakfast <price>$6.95 <description>two eggs, bacon or sausage, toast, and our ever-popular hash browns 950

9. Percobaan 9 (XML dengan Data Binding)  Source Code cd_katalog_binding.html data mengambil dari source code cd_catalog.xml:

<xml id="cdcat" src="cd_catalog.xml">

<span datafld="ARTIST">

<span datafld="TITLE">

D. TUGAS WORKSHOP

Buat analisa dan kesimpulan untuk masing – masing percobaan !