Apa itu penyimpanan sesi javascript?

Properti Window sessionStorage() digunakan untuk menyimpan pasangan kunci/nilai di browser web. Ini menyimpan pasangan kunci/nilai di browser hanya untuk satu sesi dan data kedaluwarsa segera setelah sesi baru dimuat

Jika Anda seorang pengembang web, Anda mungkin pernah mendengar tentang penyimpanan lokal dan penyimpanan sesi. Tapi apa sebenarnya mereka?

API Penyimpanan Web

Sebelum HTML5, developer hanya mengandalkan cookie untuk menyimpan data di sisi klien. Namun, saat HTML5 diperkenalkan, developer diberi pilihan untuk menggunakan API baru bernama Web Storage. API ini menyediakan dua jenis penyimpanan yang berbeda. penyimpanan lokal dan penyimpanan sesi. Penyimpanan lokal dan penyimpanan sesi memungkinkan aplikasi web menyimpan data secara lokal di browser pengguna

Penyimpanan Sesi

Penyimpanan sesi adalah jenis penyimpanan web yang memungkinkan data disimpan di sisi klien hanya selama durasi sesi saat ini. Setelah pengguna menutup browsernya, semua data yang telah disimpan di penyimpanan sesi akan dihapus

Penyimpanan sesi berguna untuk menyimpan data sementara yang tidak perlu dipertahankan di seluruh sesi, seperti ID sesi atau data sementara yang hanya digunakan selama durasi sesi saat ini.

Mengatur Data di Penyimpanan Sesi

Untuk mengatur data dalam penyimpanan sesi, Anda dapat menggunakan metode setItem(). Metode ini menerima dua argumen

  • Kunci, yang merupakan string yang akan digunakan untuk mengidentifikasi data
  • Nilai, yaitu data yang akan disimpan

Misalnya, untuk menyetel variabel sesi bernama user_id dengan nilai 1234, Anda akan melakukan hal berikut

sessionStorage.setItem(‘user_id’, ‘1234’);

Mengambil Data Dari Penyimpanan Sesi

Untuk mengambil data dari penyimpanan sesi, Anda dapat menggunakan metode getItem(). Metode ini menerima satu argumen, yang merupakan kunci dari data yang ingin Anda ambil. Misalnya, untuk mendapatkan nilai variabel sesi user_id, Anda akan melakukan hal berikut

let user_id = sessionStorage.getItem(‘user_id’); // 1234
_

Menghapus Data Dari Penyimpanan Sesi

Untuk menghapus data dari penyimpanan sesi, Anda dapat menggunakan metode removeItem(). Metode ini menerima satu argumen, yang merupakan kunci dari data yang ingin Anda hapus. Untuk menghapus variabel sesi user_id, Anda akan melakukan hal berikut

sessionStorage.removeItem(‘user_id’);

Foto oleh ThisisEngineering RAEng di Unsplash

Penyimpanan lokal

Penyimpanan lokal adalah jenis penyimpanan web yang memungkinkan data disimpan di sisi klien tanpa batas. Tidak seperti penyimpanan sesi, data yang disimpan di penyimpanan lokal tetap ada bahkan setelah browser ditutup

Penyimpanan lokal berguna untuk menyimpan data yang perlu disimpan di seluruh sesi, seperti preferensi atau pengaturan pengguna

Mengatur Data di Penyimpanan Lokal

Untuk mengatur data di penyimpanan lokal, Anda juga dapat menggunakan metode setItem(). Metode ini menerima dua argumen yang sama

  • Kunci, yang merupakan string yang akan digunakan untuk mengidentifikasi data
  • Nilai, yaitu data yang akan disimpan

Menggunakan contoh yang sama, kita dapat menetapkan variabel lokal bernama user_id ke nilai 1234

localStorage.setItem(‘user_id’, ‘1234’);

Mengambil Data Dari Penyimpanan Lokal

Untuk mengambil data dari penyimpanan lokal, Anda juga dapat menggunakan metode getItem(). Metode ini menerima argumen tunggal yang sama, yang merupakan kunci dari data yang ingin Anda ambil

let user_id = localStorage.getItem(‘user_id’); // 1234
_

Menghapus Data Dari Penyimpanan Lokal

Untuk menghapus semua data dari penyimpanan lokal, Anda dapat menggunakan metode

let user_id = sessionStorage.getItem(‘user_id’); // 1234
2. Metode ini tidak menerima argumen apa pun

localStorage.clear();
_

Untuk menghapus item tertentu dari penyimpanan lokal, Anda dapat menggunakan metode removeItem(). Metode ini menerima satu argumen, yang merupakan kunci dari data yang ingin Anda hapus

localStorage.removeItem(‘user_id’);

Penyimpanan Lokal vs Penyimpanan Sesi

Sekarang kita telah membahas dasar-dasar penyimpanan lokal dan penyimpanan sesi, mari kita bahas perbedaan antara keduanya

Perbedaan utama antara penyimpanan lokal dan penyimpanan sesi adalah bahwa data yang disimpan di penyimpanan lokal tetap ada bahkan setelah browser ditutup, sementara data yang disimpan di penyimpanan sesi hanya tersedia selama durasi sesi saat ini.

Perbedaan lainnya adalah penyimpanan lokal tidak berbasis sesi, artinya data di dalam penyimpanan lokal harus dihapus secara manual. Terakhir, kapasitas penyimpanan penyimpanan lokal juga lebih besar dari penyimpanan sesi

Penyimpanan lokal paling baik digunakan untuk data yang perlu disimpan di seluruh sesi, seperti preferensi atau pengaturan pengguna. Penyimpanan sesi lebih cocok untuk data sementara yang tidak perlu disimpan setelah sesi berakhir

Saya harap artikel ini menghilangkan kebingungan yang Anda miliki. Semoga berhasil dengan proyek pengkodean Anda

Lebih banyak konten di PlainEnglish. io. Mendaftar untuk buletin mingguan gratis kami. Ikuti kami di Twitter dan LinkedIn. Lihat Perselisihan Komunitas kami dan bergabunglah dengan Talent Collective kami

Mengapa kami menggunakan penyimpanan sesi dalam javascript?

Penyimpanan sesi memungkinkan Anda menyimpan data di browser bergantung pada memori sistem dan data yang disimpan di browser hingga browser ditutup . Dengan kata lain, menutup browser akan menghapus semua data yang tersimpan di penyimpanan sesi.

Apa itu penyimpanan lokal dan penyimpanan sesi dalam javascript?

jendela. localStorage - menyimpan data tanpa tanggal kedaluwarsa . jendela. sessionStorage - menyimpan data untuk satu sesi (data hilang saat tab browser ditutup)

Apakah penyimpanan sesi javascript aman?

Ringkasan & Kesimpulan . Oleh karena itu hindari menyimpan data sensitif di penyimpanan browser. Disarankan untuk menggunakan penyimpanan browser bila ada, Tidak ada data sensitif. Both SessionStorage and LocalStorage are vulnerable to XSS attacks. Therefore avoid storing sensitive data in browser storage. It's recommended to use the browser storage when there is, No sensitive data.

Bagaimana cara memeriksa penyimpanan sesi dalam javascript?

# Lihat kunci dan nilai sessionStorage . Click the Application tab to open the Application panel. Perluas menu Penyimpanan Sesi. Klik domain untuk melihat key-value pair-nya. Klik baris tabel untuk melihat nilai di penampil di bawah tabel.