Home » » Membuat Dan Menyimpan Cokie (Belajar JavaScript)

Membuat Dan Menyimpan Cokie (Belajar JavaScript)

Written By Nether Blog on Thursday, June 28, 2012 | 3:34:00 PM

Apa Itu Cokie?
Cookie adalah sebuah variabel yang disimpan pada komputer pengguna. Setiap kali permintaan komputer halaman yang sama dengan browser, maka browser akan mengirimkan data tersebut yang tersimpan pada cokie. Dengan bantuan JavaScript, kita pun bisa membuat dan mengambil nilai cookie tersebut.


Contoh cookie:
  • Nama cookie - Pertama kali pengunjung datang ke halaman web Anda, ia harus mengisi / nya namanya. Nama ini kemudian disimpan dalam cookie. Lain kali pengunjung tiba di halaman Anda, ia bisa mendapatkan pesan selamat datang seperti "Selamat Datang John Doe!" Nama ini diambil dari cookie yang disimpan.
  • Tanggal cookie - Pertama kali pengunjung datang ke halaman web Anda, tanggal hari ini yang disimpan dalam cookie. Lain kali pengunjung tiba di halaman Anda, dia bisa mendapatkan pesan seperti "Kunjungan terakhir anda pada hari Selasa 11 Agustus 2005!" Tanggal itu diambil dari cookie yang disimpan.

Membuat dan Menyimpan Cookie

Dalam contoh ini kita akan menciptakan sebuah cookie yang menyimpan nama pengunjung. Pertama kali pengunjung datang ke halaman web, kita akan meminta namanya. Nama ini kemudian disimpan dalam cookie.



Jika pengunjung kembali di halaman yang sama, ia akan mendapatkan pesan "alert"
Pertama, kita membuat fungsi yang menyimpan nama pengunjung dalam sebuah variabel cookie:

function setCookie(c_name,value,exdays)
{
var exdate=new Date();
exdate.setDate(exdate.getDate() + exdays);
var c_value=escape(value) + ((exdays==null) ? "" : "; expires="+exdate.toUTCString());
document.cookie=c_name + "=" + c_value;
}

Parameter dari fungsi di atas memegang nama cookie, nilai cookie, dan jumlah hari sampai cookie berakhir.
Dalam fungsi di atas pertama-tama kita mengubah jumlah hari untuk tanggal yang valid, maka kita menambahkan jumlah hari sampai cookie harus berakhir. Setelah itu akan menyimpan nama cookie, nilai cokie dan tanggal kedaluwarsa dalam objek document.

Kemudian, kita membuat fungsi lain yang mengembalikan cookie tertentu:


function getCookie(c_name)
{
var i,x,y,ARRcookies=document.cookie.split(";");
for (i=0;i<ARRcookies.length;i++)
{
  x=ARRcookies[i].substr(0,ARRcookies[i].indexOf("="));
  y=ARRcookies[i].substr(ARRcookies[i].indexOf("=")+1);
  x=x.replace(/^\s+|\s+$/g,"");
  if (x==c_name)
    {
    return unescape(y);
    }
  }
}

Fungsi script di atas membuat sebuah array untuk mengambil nama cookie dan nilai, script akan bekerja untuk mengecek apakah cokie yang di tentukan ada atau tidak.

function checkCookie()
{
var username=getCookie("username");
  if (username!=null && username!="")
  {
  alert("Selamat Datang Kembali " + username);
  }
else
  {
  username=prompt("Masukan Nama Ente Gan :","");
  if (username!=null && username!="")
    {
    setCookie("username",username,365);
    }
  }
}

Lalu, kita membuat fungsi yang menampilkan pesan selamat datang Kembali jika alert sebelumnya di isi, tapi jika alert tidak di isi maka akan muncul kotak prompt, yang meminta nama User dan menyimpan cookie User untuk 365 hari, dengan memanggil fungsi Set Cokie:

Untuk lebih jelasnya silahkan click button di bawah ini :


Dan Berikut Script yang di gunakan, anda juga bisa memasangnya di blog :

<!DOCTYPE html>
<html>
<head>
<form action="javascript:location.reload(true)">

<script type="text/javascript">
function getCookie(c_name)
{
var i,x,y,ARRcookies=document.cookie.split(";");
for (i=0;i<ARRcookies.length;i++)
  {
  x=ARRcookies[i].substr(0,ARRcookies[i].indexOf("="));
  y=ARRcookies[i].substr(ARRcookies[i].indexOf("=")+1);
  x=x.replace(/^\s+|\s+$/g,"");
  if (x==c_name)
    {
    return unescape(y);
    }
  }
}

function setCookie(c_name,value,exdays)
{
var exdate=new Date();
exdate.setDate(exdate.getDate() + exdays);
var c_value=escape(value) + ((exdays==null) ? "" : "; expires="+exdate.toUTCString());
document.cookie=c_name + "=" + c_value;
}

function checkCookie()
{
var username=getCookie("username");
if (username!=null && username!="")
  {
  alert("Selamat Datang Kembali " + username);
  }
else
  {
  username=prompt("Coba Masukin Namanya Gan :","");
  if (username!=null && username!="")
    {
    setCookie("username",username,365);
    }
  }
}
</script>
</head>
<body onload="checkCookie()">
<input type="submit" value="Refress" />
</body>
</html>

0 komentar:

Post a Comment

Silahkan berikan komentar anda yang baik.