WEB STORAGE API

Kamu bisa loh menyimpan data pada HTML dengan bantuan Javascript tanpa bantuan database

Apa itu Web Storage API

Web Storage API adalah teknologi yang memungkinkan web untuk menyimpan data pengguna secara lokal dalam browser pengguna. Teknologi ini jauh lebih baik dari cookies karena dapat menyimpan lebih banyak data, sekitar 5 MB per domain. Selain itu, data yang disimpan dengan Web Storage API tidak ikut terkirim pergi saat kita membuat request kepada server, sehingga menghemat bandwidth.

Fitur Web Storage API JavaScript

Dua komponen utama dari Web Storage API adalah Local Storage dan Session Storage. Kedua komponen ini memungkinkan web untuk menyimpan pasangan key-value dalam browser.

Local Storage

Local Storage digunakan untuk menyimpan data pengguna secara permanen atau hingga data tersebut dihapus oleh pengguna atau oleh aplikasi web. Data ini bisa tetap ada walaupun setelah browser ditutup dan dibuka kembali.

Session Storage

Berbeda dengan Local Storage, Session Storage hanya menyimpan data selama sesi browser aktif. Artinya, data akan hilang setelah jendela atau tab browser ditutup.

Bagaimana Menggunakan Web Storage API

Berikut adalah contoh sederhana tentang bagaimana menggunakan Local Storage dan Session Storage dalam JavaScript.

Menggunakan Local Storage

// Menyimpan data ke local storage
localStorage.setItem('nama', 'Budi');

// Mengambil data dari local storage
var name = localStorage.getItem('nama');

// Menghapus data dari local storage
localStorage.removeItem('nama');

// Menghapus semua data dari local storage 
localStorage.clear();

Menggunakan Session Storage

// Menyimpan data ke session storage
sessionStorage.setItem('nama', 'Budi');

// Mengambil data dari session storage
var name = sessionStorage.getItem('nama');
  
// Menghapus data dari session storage
sessionStorage.removeItem('nama');

// Menghapus semua data dari session storage
sessionStorage.clear();

Dengan Web Storage API, Kamu sekarang dapat menyimpan dan memanipulasi data pengguna dengan lebih efisien dalam aplikasi web Kamu.

Limitasi dan Pertimbangan Keamanan

Penting untuk diingat bahwa data yang disimpan menggunakan Web Storage API tidak tersimpan secara terenkripsi dan mudah diakses melalui inspektur browser maupun JavaScript. Oleh karena itu, sangat tidak disarankan untuk menyimpan informasi sensitif seperti password atau data kartu kredit pengguna. Selain itu, karena Web Storage API tidak memiliki mekanisme kontrol akses, jangan gunakan teknologi ini untuk menyimpan data yang bersifat private atau data yang mungkin kamu tidak ingin dapat diakses oleh website lain.