ذخیره داده ها بر روی کامپیوتر کاربر
ذخیره داده ها بر روی کامپیوتر کاربر (Client)
در گذشته این کار توسط کوکی ها انجام می شد. کوکی ها برای تعداد زیاد داده کارایی ندارد، زیرا کوکی ها با هر بار درخواست از سرور انتقال پیدا می کنند، که این باعث کاهش سرعت و عدم کارایی مناسب می شود.
در HTML5 داده ها با هر بار درخواست از سرور ارسال نمی شوند و فقط زمانی که نیاز به آنها داشته باشیم استفاده می شوند. همچنین امکان ذخیره مقدار زیادی اطلاعات بدون تاثیر منفی روی کارایی سایت نیز وجود دارد.
داده های سایت های مختلف بصورت key/value ذخیره می شوند و هر وب سایت فقط به داده هایی که خودش ذخیره کرده می تواند دسترسی پیدا کند.
HTML5 از JavaScript برای ذخیره سازی و دسترسی به داده ها استفاده می کند.
پشتیبانی مرورگرها
مرورگرهای Internet Explorer 8+, Firefox, Opera, Chrome, Safari ذخیره داده ها را پشتیبانی می کنند.
توجه: Internet Explorer 7 و نسخه های قدیمی تر آن، web storage را پشتیبانی نمی کنند.
localStorage و sessionStorage
HTML5 دو شیء جدید برای ذخیره سازی داده ها بر روی کلاینت معرفی کرده است:
- localStorage: ذخیره داده ها بدون زمان انقضاء
- sessionStorage: داده های یک جلسه (session) را ذخیره می کند.
قبل از استفاده از اشیاء بالا، باید بررسی کنید که مرورگر، localStorage و sessionStorage را پشتیبانی می کند یا نه.
{
// Yes! localStorage and sessionStorage support!
// Some code.....
}
else
{
// Sorry! No web storage support..
}
شیء localStorage
این شیء داده ها را برای زمان نامحدودی ذخیره می کند. این داده ها زمانی که مرورگر بسته شود حذف نخواهد شد و روز بعد، هفته بعد و حتی سال بعد در دسترس خواهد بود.
چگونگی ایجاد و دسترسی به loaclStorage
مثال (ذخیره داده ها بر روی کامپیوتر کاربر)
document.getElementById("result").innerHTML="Last name: "
+ localStorage.lastname;
توضیح مثال:
- ابتدا یک شیء loaclStorage با نام "lastname" و مقدار "Smith" ایجاد شده است.
- در ادامه مقدار "lastname" را بازیابی می کنیم و سپس محتوای عنصر با شناسه "result" را با آن مقداردهی می کنیم.
توجه: داده ها همیشه بصورت رشته ای ذخیره می شوند. بیاد داشته باشید که در صورت نیاز باید آنرا تبدیل کنید.
در مثال زیر، تعداد دفعات کلیک کاربر روی یک دکمه را نشان می دهد. در این کد برای اینکه بتوان شمارنده را افزایش داد، مقدار رشته ای به عددی تبدیل شده است:
مثال (ذخیره داده ها بر روی کامپیوتر کاربر)
{
localStorage.clickcount=Number(localStorage.clickcount)+1;
}
else
{
localStorage.clickcount=1;
}
document.getElementById("result").innerHTML="You have clicked the button " + localStorage.clickcount + " time(s).";
شیء sessionStorage
این شیء اطلاعات یک جلسه را ذخیره می کند. این اطلاعات زمانی که کاربر پنجره مرورگر را می بندد از بین می رود.
در مثال زیر، تعداد دفعات کلیک کاربر روی یک دکمه در جلسه جاری را نشان می دهد:
مثال (ذخیره داده ها بر روی کامپیوتر کاربر)
{
sessionStorage.clickcount=Number(sessionStorage.clickcount)+1;
}
else
{
sessionStorage.clickcount=1;
}
document.getElementById("result").innerHTML="You have clicked the button " + sessionStorage.clickcount + " time(s) in this session.";
- نوشته شده توسط امیر پهلوان صادق
- بازدید: 19574
دیدگاه‌ها
سلام
این شرط چه کاری را انجام می دهد ( if (localStorage.c lickcount
با سلام.
عبارت localStorage.cl ickcount تعداد دفعات هر کلیک رو نگهداری میکنه. شرط موردنظر چک میکنه اگه این عبارت مقداری غیر از صفر داشت، یک واحد بهش اضافه بشه و اگر مقدارش صفر بشه، شرط غلط میشه و کدهای داخل else اجرا میشه. در else هم مقدار localStorage.cl ickcount برابر یک میشه، به این معنی که اولین بار هست که کلیک میشه!
سلام
مقدار این دو یارامتر بالا کجای سیستم کلاینت ذخیره می شوند ( لینوکس و ویندوز )کدام دایکتوری ؟با تشکر از آموزش هاتون .
پارامترهای مذکور در فایلی با فرمت SQLite ذخیره می شوند، بنابراین شما برای مشاهده مقادیر نیاز به viewer پایگاه داده SQLite دارید.
شاید این سوال برایتان پیش بیاید که SQLite چیست؟
SQLite یک برنامه مدیریت بانک اطلاعاتی مبتنی بر زبان استاندارد SQL هست که به صورت رایگان عرضه می شود. بر خلاف مدل های مرسوم بانک اطلاعاتی ( مثل اوراکل ، MySql ، SQL و …) که به صورت Client/Server می باشند و نیازمند نصب و پیکر بندی هستند ، SQLite یک برنامه مدیریت بانک اطلاعاتی مستقل از سیستم عامل و بدون نیاز به نصب و پیکر بندی است.
موزیلا فایرفاکس و گوگل کروم انواع مختلفی از تنظیمات (نظیر کوکی‌ها، تاریخچهٔ بازدید وب و غیره) را در یک پایگاه دادهٔ اس‌کیوال لایت ذخیره می‌کنند.
سلام
بسیار ممنونم از پاسخ خوب و کاملتون . برقرار باشید