تفاوت کاربرد localStorage و sessionStorage در مرورگر

تفاوت کاربرد localStorage و sessionStorage در مرورگر

تفاوت کاربرد localStorage و sessionStorage در مرورگر

Introduction to localStorage and sessionStorage

توسط : admin
localStorage و sessionStorage ، بخشی از API ذخیره سازی وب ، دو ابزار عالی برای ذخیره اطلاعات به فرمت کلید/مقدار در مرورگر هستند.

 

هر دو localStorage و sessionStorage مزایای استفاده مشابه با کوکی ها را ارائه می دهند:

  • داده هابه صورت محلی  یا اوکال ذخیره می شوند و توسط سرور قابل خواندن نیستند ، و این دو ، مشکل امنیتی را که کوکی ها دارند را از بین می برد.
  • اجازه می دهد تا داده های بسیار بیشتری ذخیره شود (10 مگابایت برای اکثر مرورگرها).
  • استفاده از آن ساده تر است و نحو بسیار ساده است.

 

همچنین در همه مرورگرهای مدرن پشتیبانی می شود ، بنابراین می توانید امروز بدون هیچ مشکلی از آن استفاده کنید. بدیهی است ، که داده ها روی سرور قابل خواندن نیستند ،ولی کوکی ها هنوز هم کاربرد دارند ، به خصوص هنگام تأیید اعتبار.

 

مقایسه localStorage و sessionStorage

localStorage و sessionStorage دقیقاً همان کار را انجام می دهند و API یکسانی دارند ، اما با sessionStorage داده ها فقط تا زمانی که پنجره یا تب مرورگر بسته شود ، وجود دارند ، در حالی که با localStorage داده ها همچنان وجود  دارند تا زمانی که کاربر یا به طور دستی  حافظه نهان مرورگر را پاک کند و یا برنامه وب اقدام به پاک کردن آن بنماید . مثال های موجود در این پست برای localStorage است ، اما همین نحو برای sessionStorage نیز کار می کند.

 

ایجاد مقدار در  localStorage

let key = 'Item 1';
localStorage.setItem(key, 'Value');

 

خواندن مقدار از  localStorage

let myItem = localStorage.getItem(key);

 

بروزرسانی مقدار در  localStorage

localStorage.setItem(key, 'New Value');

 

حذف مقدار از  localStorage

localStorage.removeItem(key);

 

خالی کردن  localStorage

localStorage.clear();

 

ذخیره با فرمت JSON در localStorage

فقط رشته ها می توانند با localStorage یا sessionStorage ذخیره شوند ، اما می توانید از JSON.stringify برای ذخیره objects ها و JSON.parse برای خواندن آنها استفاده کنید:

 

// Create item:
let myObj = { name: 'Skip', breed: 'Labrador' };
localStorage.setItem(key, JSON.stringify(myObj));

// Read item:
let item = JSON.parse(localStorage.getItem(key));

 

بررسی آیتم ها در localStorage

در اینجا نحوه تست موارد موجود در loclaStorage آورده شده است:

if (localStorage.length > 0) {
  // We have items
} else {
  // No items
}

 

بررسی پشتیبانی مرورگر از localStorage

if (window.localStorage) {
  // localStorage supported
}

 

تکرار آیتم ها در localStorage

localStorage یا sessionStorage روش ForEach را ندارد ، اما می توانید آیتمها را با یک حلقه تکرار مرور کنید:

for (let i = 0; i < localStorage.length; i++){
  let key = localStorage.key(i);
  let value = localStorage.getItem(key);
  console.log(key, value);
}

 

 

نظرات :

در عرض چند دقیقه برای ایجاد حساب

کاربری خود اقدام کنید


اکنون حساب کاربری خود را ایجاد کنید!


ایجاد حساب کاربری

با ثبت نام در نیلوتک از آخرین بروز رسانی های آموزش ها و مقالات سایت مطلع شوید