Cara Membuat Halaman Web Menggunakan XML

Penggunaan XML untuk mencipta laman web membolehkan pembangun menambah kandungan baharu secara berkala tanpa perlu mengubah suai halaman HTML secara manual. Dengan XML, satu laman web boleh dikemas kini setiap hari dengan hanya memuat naik satu fail XML.

Langkah 1: Buat Fail XML

Buat fail XML yang mengandungi tiga tag dan dua atribut: satu tag akar dan dua tag anak untuk berita harian dan gambar. Salin contoh berikut ke dalam dokumen teks kosong.

<doc>
  <item status='publish'>
    Kuda keturunan Sepanyol dibawa ke Lapangan Santo Domindo pagi ini. Ia merupakan pemandangan yang indah dan ramai orang datang menontonnya. Saya membawa teman wanita dan sepupunya. Kami berseronok.
  </item>
  <pic status='publish'>img1.jpg</pic>
</doc>

Simpan teks sebagai news.xml. Atribut status memberitahu skrip web untuk mengekstrak maklumat tertentu.

Langkah 2: Cipta Skrip Perl CGI

Skrip ini membuka fail news.xml, mencari teks antara tag <item> dan nama fail gambar antara tag <pic>, lalu mencetak halaman web. Salin kod berikut ke dalam fail baru.

#!/usr/bin/perl -w
print "Content-type: text/html\n\n";
open(my $fh, '<', 'news.xml') or die 'Tidak dapat membuka fail';
my $doc = '';
while (my $line = <$fh>) {
    $doc .= $line;
}
close $fh;

my ($item) = $doc =~ /<item status='publish'>(.*?)<\/item>/is;
my ($pic)  = $doc =~ /<pic status='publish'>(.*?)<\/pic>/is;

print "
Berita Matt
\n";
print "$item
\n";
print "\n";

Simpan skrip sebagai xml_site.cgi dan pastikan ia boleh dijalankan di server.

Langkah 3: Muat Naik Fail ke Pelayan

Muat naik news.xml dan xml_site.cgi ke dalam direktori cgi-bin. Muat naik gambar img1.jpg ke dalam folder dokumen HTML anda.

Langkah 4: Uji Laman Web

Buka skrip xml_site.cgi melalui pelayar dengan alamat seperti https://www.domainanda.com/~root/cgi-bin/xml_site.cgi. Anda sepatutnya melihat tajuk Berita Matt diikuti garis mendatar, gambar kuda, dan keterangan.

Langkah 5: Tambah Masuk Baru ke Fail XML

Buka news.xml di editor teks, salin entri pertama dan tampalkannya di bawah. Tukar atribut entri pertama kepada null dan ubah nama gambar kepada img2.jpg. Tulis berita baharu mengenai anjing peliharaan bernama "La Nina" yang berkunjung ke doktor haiwan. Pastikan atribut status kedua entri juga ditetapkan kepada publish. Simpan fail.

Muat naik semula news.xml, muat semula skrip xml_site.cgi di pelayar, dan laman akan memperbaharui dengan berita dan gambar baru.

Tips

• Contoh ini sangat asas, namun ia boleh dijadikan asas bagi aplikasi lebih besar dengan lebih banyak medan XML, CSS, dan JavaScript.
• Jika anda merancang menyimpan ribuan rekod XML, pertimbangkan untuk mengembangkan aplikasi Perl yang menghasilkan dokumen XML secara automatik.

Amaran

• Pastikan sintaks betul. Satu titik koma yang salah boleh menyebabkan skrip tidak berjalan.