Sesi dan penyimpanan lokal adalah metode penyimpanan browser yang memungkinkan Anda menyimpan data bersama permintaan HTTP stateless. Mereka adalah alternatif untuk penyimpanan berbasis cookie dan memiliki banyak kegunaan dalam pengembangan web.

Meskipun mereka beroperasi dengan cara yang sangat mirip, ada perbedaan signifikan yang harus Anda ketahui.

Penyimpanan Lokal dan Penyimpanan Sesi: Apa Kegunaannya?

Penyimpanan lokal dan sesi adalah API JavaScript yang dapat Anda gunakan untuk menyimpan data di sisi klien. Mereka mengizinkan situs web untuk menyimpan data di browser dan menginstruksikan browser untuk mengaksesnya nanti.

Tergantung pada kebutuhan Anda, Anda dapat menggunakan penyimpanan lokal atau sesi untuk menyimpan data. Kedua metode penyimpanan mirip dengan cookie tetapi tanpa masalah privasi yang sama seputar cookie. Oleh karena itu, sebagian besar situs web modern lebih suka menggunakan metode penyimpanan web saja atau menggabungkannya dengan cookie sebagai cadangan.

Tidak seperti cookie, penyimpanan lokal dan penyimpanan sesi tidak mengirim data ke server melalui header HTTP. Anda harus menggunakannya untuk fungsionalitas sisi klien saja.

instagram viewer

Selain itu, penyimpanan lokal dan sesi masing-masing memiliki batas penyimpanan sekitar 5 MB per domain. Mereka menyediakan lebih banyak penyimpanan daripada cookie, yang hanya memiliki kapasitas 4 KiB per cookie.

Apa itu Penyimpanan Sesi?

Sesi penjelajahan memperkirakan penggunaan situs web oleh Anda. Jika Anda mengunjungi sebuah situs, menjelajah sebentar, lalu mematikan komputer, Anda dapat menganggap waktu itu sebagai satu sesi. Konfigurasi browser Anda dapat mengubah ini dengan cara yang halus, tetapi sesi bertujuan untuk mewakili sebagian waktu Anda berinteraksi dengan situs.

Penyimpanan sesi unik untuk setiap tab browser. Jika Anda membuka tab baru dan menavigasi ke situs yang sama, Anda akan memulai sesi baru dengan penyimpanannya sendiri. Namun, jika Anda menggunakan fitur "tab duplikat" di browser Anda, itu dapat menggunakan kembali sesi yang sama. Anda tidak dapat terlalu mengandalkan detail spesifik dari "sesi". Alih-alih, fokuslah pada konsep inti: penyimpanan sesi bersifat sementara.

Penyimpanan sesi memiliki metode API bawaan untuk bekerja dengan data pasangan kunci/nilai. Anda dapat menyimpan data dari JavaScript seperti:

sessionStorage.setItem("kunci", "nilai");

Dan untuk mengambil nilai yang disimpan:

sessionStorage.getItem("kunci");

Perhatikan bahwa keduanya kunci dan nilai adalah tipe string saja. Jika Anda ingin menyimpan tipe yang berbeda, Anda harus mengonversinya menjadi string, secara eksplisit atau implisit.

Apa itu Penyimpanan Lokal?

Penyimpanan lokal memelihara data di semua contoh situs, baik itu di tab atau jendela yang berbeda. Ini juga permanen, sehingga data tidak akan hilang ketika Anda menutup browser Anda.

Saat Anda membuka situs web yang sebelumnya menggunakan penyimpanan lokal, situs tersebut akan selalu memiliki akses ke data yang disimpan tersebut.

Sebagai pengembang web, Anda dapat menggunakan mekanisme ini untuk menyimpan data tentang pengguna. Beberapa situs web mungkin menggunakan ini untuk membuat Anda tetap masuk atau memberikan pengalaman yang lebih dipersonalisasi.

Seperti penyimpanan sesi, Anda dapat mengatur objek penyimpanan lokal dengan satu baris kode JavaScript:

localStorage.setItem("kunci", "nilai");

Untuk mengakses nilai kunci:

localStorage.getItem("kunci");

Perhatikan bahwa metode ini bekerja dengan cara yang sama seperti penyimpanan sesi, mereka hanya menggunakan jenis penyimpanan data yang berbeda.

Sementara penyimpanan sesi menghapus data segera setelah sesi berakhir, satu-satunya cara untuk menghapus penyimpanan lokal adalah dengan menghapusnya secara eksplisit. Kedua jenis penyimpanan menawarkan dua metode untuk menghapus data. Yang pertama menghapus item data tertentu berdasarkan kuncinya:

localStorage.removeItem("kunci");

Anda juga dapat menghapus semua data yang disimpan oleh situs Anda, apa pun kuncinya:

penyimpanan lokal.clear();

Anda dapat mempelajari lebih lanjut tentang metode API penyimpanan web ini di javascript.info situs web.

Kapan Anda Membutuhkan Penyimpanan Lokal?

Karena penyimpanan lokal bersifat persisten, sebaiknya simpan data di seluruh kunjungan pengguna. Jika Anda ingin menyimpan preferensi situs atau menyimpan data jangka panjang, penyimpanan lokal sesuai. Anda mungkin tidak ingin menyimpan data yang lebih sensitif menggunakan penyimpanan lokal, karena ini bersifat permanen.

Karena penyimpanan lokal dan sesi adalah metode front-end, Anda mungkin ingin menghindari menggunakannya untuk fungsi berbasis server seperti login pengguna. Anda dapat mempertimbangkan cookie sebagai alternatif dalam kasus ini.

Kapan Anda Membutuhkan Penyimpanan Sesi?

Jika Anda ingin menyimpan data hanya saat pengguna berinteraksi dengan situs Anda, maka penyimpanan sesi sangat ideal. Ini bisa untuk caching jangka pendek atau data penggunaan tentang kunjungan tertentu ke situs Anda.

Penyimpanan sesi lebih baik untuk menyimpan informasi yang lebih sensitif karena kedaluwarsa.

Penyimpanan Lokal vs. Penyimpanan Sesi: Mana yang Lebih Aman?

Seperti yang Anda lihat, metode penyimpanan lokal dan sesi serupa dalam banyak hal tetapi masih memiliki kasus penggunaan yang disesuaikan. Anda tidak boleh menganggap keduanya aman karena keduanya adalah teknologi front-end yang dapat diakses oleh JavaScript. Namun, penyimpanan sesi sangat nyaman, dan sifatnya yang sementara meyakinkan.

Penyimpanan lokal bersifat permanen sehingga dapat menimbulkan masalah keamanan tambahan. Siapa pun yang membuka browser, secara teori, dapat mengakses penyimpanan lokal. Anda harus menyadari cara kerja serangan XSS dan bagaimana mencegahnya.

Penyimpanan Lokal atau Penyimpanan Sesi: Mana yang Harus Anda Gunakan?

Penyimpanan sesi sedikit lebih aman karena sifatnya yang sementara. Namun, pilihan metode penyimpanan web Anda tergantung pada kebutuhan Anda. Penyimpanan JavaScript paling cocok untuk penggunaan sisi klien saja. Tetapi ia menawarkan penyimpanan data berbasis browser yang nyaman dan sangat mudah digunakan.

Ingatlah bahwa meskipun penyimpanan lokal menyimpan data di beberapa tab, sebagian besar penyimpanan sesi bersifat unik untuk setiap tab. Anda harus memastikan bahwa aplikasi Anda membuat asumsi sesedikit mungkin dan memenuhi kasus edge.

Cookie adalah bentuk persistensi data yang lebih lama, tetapi masih sangat banyak digunakan. Anda mungkin ingin memeriksanya untuk data yang perlu Anda kirimkan ke server.