URL Shortener atau pemendek URL merupakan situs yang memberikan layanan untuk memendekkan alamat URL yang panjaaaang menjadi pendek. Contohnya alamat URL http://achmatim.net/2010/03/25/membuat-album-foto-dengan-dreamweaver-cepat-mudah/ bisa disingkat hanya dengan http://bit.ly/9I9nL4. Saat ini cukup banyak penyedia layanan pemendek URL (URL Shortener). Beberapa diantaranya yang cukup banyak digunakan adalah http://tinyurl.com (URL Shortener pertama), http://bit.ly, http://is.gd/, http://singkat.web.id, dan sebagainya. URL Shortener yang terakhir saya sebutkan tersebut merupakan URL shortener yang saya buat dengan memanfaatkan library (program) yang tersedia di internet. Disamping menggunakan library yang sudah ada, sebenarnya kita dapat membuat URL Shortener sendiri secara mudah, dengan memanfaatkan API dari situs URL Shortener yang sudah ada, seperti bit.ly. Ingin tau caranya? Ikuti terus tutorial ini.

Mendaftar di Bit.ly untuk mendapatkan API Key

API atau Application Programming Interface merupakan suatu program (software) yang menghubungkan antara satu aplikasi dengan aplikasi (software) lainnya. Dengan adanya API kita dapat membuat aplikasi yang baru dengan memanfaatkan aplikasi yang sudah ada tanpa perlu membangun program dari awal. API merupakan penerapan dari konsep Web Services. Dalam kaitannya dengan URL Shortener, bit.ly merupakan salah satu situs yang menyediakan API sehingga memungkinkan kita untuk membuat aplikasi pemendek URL kita sendiri tanpa harus dipusingkan dengan bagaimana proses programnya. Kita cukup menggunakannya saja seperti contoh pada tutorial ini.

Untuk dapat menggunakan dan mengakses API dari suatu layanan, umumnya kita harus memiliki API key, mirip seperti password hanya memiliki kombinasi yang lebih rumit dan biasanya dihasilkan secara otomatis oleh program tertentu (kita tidak dapat menentukan sendiri). Untuk mendapatkan API key dari bit.ly, kita harus mendaftar terlebih dahulu. Pendaftaran di bit.ly gratis dan tidak rumit, hanya cukup memasukkan username, email dan password. Setelah berhasil mendaftar, kita dapat login ke bit.ly serta dapat mengakses API key kita di bagian menu “Account”. Pada dasarnya API key berfungsi seperti layaknya password, jadi jangan dishare dengan orang lain.

Setelah kita memiliki API key maka kita sudah dapat menggunakannya untuk membuat aplikasi kita sendiri.

Membuat Program

Kita akan merancang contoh program sesederhana mungkin. Di dalam contoh program akan ditampilkan sebuah form yang digunakan untuk menginput alamat URL asli. Selanjutnya tersedia suatu tombol dimana saat diklik, program akan mengirimkan alamat URL yang diinputkan melalui API dari bil.ly. Hasil respon dari API bit.ly akan diambil dan ditampilkan di program (layar).

Berikut ini program lengkapnya.

Nama File: bitly-url-shortener.php

  1. <html>
  2. <head>
  3. 	<title>Make Your Own URL Shortener with Bit.ly API</title>
  4. 	<style type="text/css">
  5. 	html { font-family:arial;}
  6. 	p {font-size:12px;}
  7. 	input { font-size:20px;}
  8. 	a, span.url { color:#990000; }
  9. 	</style>
  10. 	<script type="text/javascript">
  11. 	function cek(f) {
  12. 		if (f.longurl.value == '') {
  13. 			alert ("Enter your long URL");
  14. 			return false;
  15. 		} else {
  16. 			return true;
  17. 		}
  18. 	}
  19. 	</script>
  20. </head>
  21. <body>
  22. <h1>URL Shortener with Bit.ly API</h1>
  23. <div style="border:1px solid #000000;padding:5px">
  24. <form action="" method="post" onsubmit="return cek(this)">
  25. <p>Enter your long url and click "Shorten" button.</p>
  26. <input type="text" name="longurl" value="" size="40"/>
  27. <input type="submit" name="shorten" value="Shorten"/>
  28. </form>
  29. <?php
  30. if (isset($_POST['shorten'])) {
  31. 	$longurl = $_POST['longurl'];
  32. 	$login 	= "username"; //username login bit.ly
  33. 	$appkey = "api-key"; //API key
  34. 	$shorturl = make_bitly_url ($longurl, $login, $appkey, 'json');
  35. 	echo "<p><strong>Your long URL is</strong> <span class='url'>$longurl </span></p>";
  36. 	echo "<p><strong>Your short URL is</strong> <span class='url'>$shorturl </span></p>";
  37. 	echo "<p><strong>Try your shorten URL:</strong> <a href='$shorturl' target='_blank'>$shorturl</a></p>";
  38. }
  39. ?>
  40. </div>
  41. </body>
  42. </html>
  43.  
  44. <?php
  45.  
  46. /* make a URL small with bit.ly */
  47. function make_bitly_url($url, $login, $appkey, $format = 'xml',$version = '2.0.1')
  48. {
  49. 	//create the URL
  50. 	$bitly = 'http://api.bit.ly/shorten?version='.$version.'&longUrl='.urlencode($url). '&login='.$login.'&apiKey='.$appkey.'&format='.$format;
  51.  
  52. 	//get the url
  53. 	//could also use cURL here
  54. 	$response = file_get_contents($bitly);
  55.  
  56. 	//parse depending on desired format
  57. 	if(strtolower($format) == 'json') {
  58. 		$json = @json_decode($response,true);
  59. 		return $json['results'][$url]['shortUrl'];
  60. 	} else { //xml
  61. 		$xml = simplexml_load_string($response);
  62. 		return 'http://bit.ly/'.$xml->results->nodeKeyVal->hash;
  63. 	}
  64. }
  65. ?>

Penjelasan Program

  • Baris 10-19. Validasi form sederhana dengan javascript. Jika alamat URL tidak diisi maka akan ditolak.
  • Baris 22-28. Perintah untuk membuat form inputan alamat URL asli.
  • Baris 29-39. Proses untuk mengambil alamat URL yang diinputkan, selanjutnya dikirimkan ke fungsi make_bitly_ur() beserta username dan API key yang kita gunakan. Hasil dari fungsi berupa alamat yang sudah diperpendek. Selanjutnya hasil alamat tersebut ditampilkan di layar.
  • Baris 47-64. Pendefinisian fungsi make_bitly_url(). Fungsi ini akan mengirimkan alamat URL asli melalui API bit.ly dan API akan mengirimkan balik hasil URL yang sudah disingkat. Fungsi ini saya adaptasi dari blog David Walsh.

Demo Program Download Program & Tutorial

Popularity: 5% [?]