Indonesia

Tutorial PHP

Operator PHP

Perintah Kendali PHP

Array PHP

Fungsi PHP

Superglobals PHP

Penanganan Berkas PHP

PHP Berorientasi Objek

Pengembangan Web PHP

PHP AJAX

PHP XML

Contoh Login PHP

PHP Tingkat Lanjut

PHP - AJAX RSS Feed Example

Hai, para programer muda! Hari ini, kita akan memulai perjalanan menarik ke dunia PHP, AJAX, dan feed RSS. Jangan khawatir jika istilah ini terdengar seperti sup abjad saat ini - hingga akhir tutorial ini, Anda akan bermain dengan mereka seperti seorang ahli! Ayo masuk ke dalam!

PHP - AJAX RSS Feed Example

Really Simple Syndication (RSS)

Sebelum kita mulai mengoding, mari kita pahami apa itu RSS.

RSS adalah singkatan dari Really Simple Syndication. Itu seperti layanan pengiriman berita untuk internet. Bayangkan Anda memiliki situs berita favorit, tapi Anda tidak ingin mengunjunginya setiap hari untuk memeriksa artikel baru. Itu adalah di mana RSS berguna!

Sebuah feed RSS adalah file khusus yang digunakan situs web untuk menerbitkan konten terbaru mereka dalam format standar. Format ini memungkinkan program lain (disebut pembaca RSS) mudah mengambil dan menampilkan pembaruan terbaru dari beberapa situs web di satu tempat.

Proyek Kita: Membangun Pembaca Feed RSS

Hari ini, kita akan membuat pembaca feed RSS sederhana menggunakan PHP dan AJAX. Proyek kita akan memiliki dua bagian utama:

  1. Halaman HTML (index.html) yang menampilkan feed dan berisi kode AJAX.
  2. Skrip PHP (rss.php) yang mengambil dan menguraikan feed RSS.

Ayo mulai dengan halaman HTML.

Index.html

Ini adalah kode untuk file index.html kita:

<!DOCTYPE html>
<html lang="id">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Pembaca Feed RSS</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#getFeed").click(function(){
$.ajax({
url: "rss.php",
type: "GET",
dataType: "json",
success: function(data){
var html = "<ul>";
$.each(data, function(index, item){
html += "<li><a href='" + item.link + "'>" + item.title + "</a></li>";
});
html += "</ul>";
$("#feedContent").html(html);
},
error: function(){
$("#feedContent").html("Terjadi kesalahan saat mengambil feed.");
}
});
});
});
</script>
</head>
<body>
<h1>Pembaca Feed RSS Saya</h1>
<button id="getFeed">Dapatkan Feed Terbaru</button>
<div id="feedContent"></div>
</body>
</html>

Sekarang, mari kitauraikan ini:

  1. Kita mulai dengan struktur HTML dasar.
  2. Dalam bagian <head>, kita termasuk jQuery, yang akan membuat panggilan AJAX kita mudah.
  3. Kita memiliki skrip yang dijalankan saat dokumen siap. Itu menempelkan event klik pada tombol "Dapatkan Feed Terbaru".
  4. Ketika tombol diklik, itu membuat panggilan AJAX ke skrip PHP kita (rss.php).
  5. Jika panggilan berhasil, itu membuat daftar tak terurut dari data feed dan menampilkannya di div feedContent.
  6. Jika ada kesalahan, itu menampilkan pesan kesalahan.

rss.php

Sekarang, mari kita buat skrip PHP kita yang akan mengambil dan menguraikan feed RSS:

<?php
// Izinkan permintaan cross-origin
header("Access-Control-Allow-Origin: *");
header("Content-Type: application/json; charset=UTF-8");

// URL feed RSS
$feedUrl = "http://rss.cnn.com/rss/edition.rss";

// Buat objek DOMDocument baru
$xmlDoc = new DOMDocument();

// Muat feed RSS
$xmlDoc->load($feedUrl);

// Dapatkan semua elemen <item>
$items = $xmlDoc->getElementsByTagName('item');

$feed = array();

// Loop melalui setiap <item>
foreach ($items as $item) {
$title = $item->getElementsByTagName('title')->item(0)->nodeValue;
$link = $item->getElementsByTagName('link')->item(0)->nodeValue;

// Tambahkan item ini ke array feed kita
$feed[] = array(
'title' => $title,
'link' => $link
);
}

// Output feed sebagai JSON
echo json_encode($feed);
?>

Ayouraikan skrip PHP ini:

  1. Kita mulai dengan menyetel header untuk mengizinkan permintaan cross-origin dan menentukan bahwa kita mengoutput JSON.
  2. Kita tentukan URL feed RSS yang kita ingin ambil (dalam hal ini, berita utama CNN).
  3. Kita buat objek DOMDocument baru dan gunakannya untuk memuat feed RSS.
  4. Kita dapatkan semua elemen <item> dari feed (setiap <item> mewakili satu cerita atau artikel).
  5. Kita loop melalui setiap item, ekstrak judul dan tautan, dan menambahkannya ke array $feed.
  6. Akhirnya, kita encode array $feed sebagai JSON dan outputnya.

Cara Kerjanya Semua Bersama

Ketika Anda membuka index.html di browser Anda, Anda akan melihat tombol "Dapatkan Feed Terbaru". Ketika Anda mengklik tombol ini:

  1. JavaScript di index.html membuat panggilan AJAX ke rss.php.
  2. rss.php mengambil feed RSS, menguraikannya, dan mengembalikan data sebagai JSON.
  3. JavaScript menerima data JSON ini dan menggunakannya untuk membuat daftar tautan di halaman.

Dan voilà! Anda baru saja membuat pembaca feed RSS sederhana menggunakan PHP dan AJAX!

Metode yang Digunakan

Ini adalah tabel metode utama yang kita gunakan dalam proyek ini:

Metode Deskripsi
$.ajax() Metode jQuery untuk melakukan permintaan AJAX
$.each() Metode jQuery untuk mengulang array atau objek
DOMDocument::load() Metode PHP untuk memuat XML dari file atau URL
getElementsByTagName() Metode PHP untuk mendapatkan elemen berdasarkan nama tag
json_encode() Fungsi PHP untuk mengkodekan nilai ke format JSON

Ingat, pemrograman adalah tentang praktik dan eksperimen. Jangan khawatir untuk memodifikasi kode ini, mencoba feed RSS yang berbeda, atau menambahkan fitur baru. Semakin Anda bermain dengannya, semakin Anda akan memahami bagaimana semua itu berkerja bersama.

Selamat coding, para ahli teknologi masa depan!

Credits: Image by storyset

Tutorial Sebelumnya:
PHP - Pencarian Otomatis AJAX
Tutorial Selanjutnya:
PHP - Pengenalan XML