Web Storage

Матеріал з Вікіпедії — вільної енциклопедії.
Перейти до навігації Перейти до пошуку
HTML

Web Storage, Веб сховище або DOM сховище — це програмні методи і протоколи вебдодатків, що використовуються для зберігання даних у веббраузері. Вебсховище являє собою постійне сховище даних, схоже на куки, але зі значно розширеною ємністю і без пересилання інформації в заголовку запиту HTTP.[1] Існують два основних типи вебсховища: локальне сховище (localStorage) і сесійне сховище (sessionStorage), що поводяться аналогічно постійним (Persistent cookie) і сесійним (Session cookie) кукам відповідно.

Вебсховище стандартизоване згідно WWW Консорціумом (W3C). Спочатку стандарти були частиною специфікації HTML5, але зараз є окремою специфікацією.[2] Вебсховище підтримується Internet Explorer 8 і вище, Mozilla-браузерами (наприклад, Firefox 2+, офіційно від 3.5),[3] Safari 4 і вище, Google Chrome 4 (підтримка sessionStorage додана від 5) і Opera починаючи з версії 10.50.[4]

Особливості[ред. | ред. код]

Вебсховище спрощено можна уявляти як удосконаленні куки. Проте з куками воно має і деякі ключові відмінності.

Розмір сховища[ред. | ред. код]

Вебсховище підтримує набагато більше місця на диску в порівнянні з куками, яким доступно всього 4 Кб, що приблизно в 1000 разів менше ніж у вебсховища: 5 Мбайт на джерело походження в Mozilla Firefox , Google Chrome, і Opera, і в Internet Explorer 10 Мбайт.[5]

Інтерфейс на стороні клієнта[ред. | ред. код]

На відміну від cookies, які можуть бути доступні як на сервері, так і на стороні клієнта, вебсховище потрапляє виключно до компетенції сценаріїв (скриптів) на боці клієнта.

Дані інтернет-сховища не передаються на сервер при кожному запиті HTTP, і вебсервер не може безпосередньо записати в Вебсховище. Однак, і одне, і друге можна явно зробити за допомогою клієнтських скриптів, що уможливлює «тонке настроювання» бажаних комунікацій з сервером.

Локальне та сесійне сховища[ред. | ред. код]

Вебсховище пропонує дві різних області: локальне та сесійне сховища, що відрізняються за своїми масштабами і тривалістю дії. Дані розміщуються в окреме для кожного джерела (комбінація протоколу, хосту й порту згідно з політикою того ж походження) локальне сховище (воно доступне для всіх скриптів з джерела, яке спочатку додало дані) і зберігаються після закриття браузера.

Дія сесійного сховища обмежується життям даного вікна, тобто для кожного відкритого вікна створюється нова сесія, яка припиняє своє існування при закритті вікна. Збереження сесії призначене для надання окремих екземплярів одного і того ж вебдодатку для роботи в різних вікнах, не заважаючи один одному. У випадку з куками подібне зробити вкрай важко або навіть неможливо.[6]

Інтерфейс і модель даних[ред. | ред. код]

Вебсховище тепер надає кращий програмний інтерфейс ніж куки, бо має інтерфейс словнику, де ключі і значення є рядками. Додатковий API для доступу до структурованих даних на основі SQL є рекомендованим стандартом W3C.[7]

Використання[ред. | ред. код]

Браузери, що підтримують вебсховище, мають глобальні змінні sessionStorage та localStorage об'явлені на рівні вікна. Наступний код на JavaScript може використовуватись для демонстрації поведінки вебсховища:

sessionStorage[ред. | ред. код]

// Зберігає значення в браузері, на тривалість сесії
sessionStorage.setItem('key', 'value');

// Повертає значення (видаляється, якщо браузер закрито)
alert(sessionStorage.getItem('key'));

localStorage[ред. | ред. код]

// Зберігає значення в браузері, поза тривалістю сесії
localStorage.setItem('key', 'value');

// Повертає значення (залишається навіть якщо браузер перевідкрито)
alert(localStorage.getItem('key'));

Доступ до даних на активному домені[ред. | ред. код]

Наступний код дістає всі значення із локального сховища для активного домену (домен сторінки, на якій знаходиться користувач). Цей код JavaScript можна виконати за допомогою інструментів розробника, що доступні у всіх сучасних браузерах: 

var output = "LOCALSTORAGE DATA:\n------------------------------------\n";
if (localStorage) {
    if (localStorage.length) {
       for (var i = 0; i < localStorage.length; i++) {
           output += localStorage.key(i) + ': ' + localStorage.getItem(localStorage.key(i)) + '\n';
       }
    } else {
       output += 'There is no data stored for this domain.';
    }
} else {
    output += 'Your browser does not support local storage.'
}
console.log(output);

Типи даних[ред. | ред. код]

За допомогою API сховища можна зберігати лише рядки.[8] При спробі зберегти дані іншого типу вони автоматично конвертуються в рядок у більшості браузерів. Хоча попереднє перетворення у JSON (JavaScript Object Notation) уможливлює сберігання будь-яких об'єктів JavaScript. 

// Збереження об’єкту замість рядка
localStorage.setItem('key', {name: 'value'});
alert(typeof localStorage.getItem('key')); // string

// Збереження цілого числа замість рядка
localStorage.setItem('key', 1);
alert(typeof localStorage.getItem('key')); // string

// Збереження об’єкту в JSON
localStorage.setItem('key', JSON.stringify({name: 'value'}));
alert(JSON.parse(localStorage.getItem('key')).name); // value

Номенклатура[ред. | ред. код]

Чернетка W3C названа «Web Storage», але назви «DOM storage» чи «Інтернет-сховище» теж широко розповсюджені.[9][10]

«DOM» у DOM-сховищі буквально не відповідає Document Object Model. Згідно W3C, «Назва DOM посилається на набір API доступний для скриптів у вебдодатках, і не обов'язково означає наявність самого „об'єкту документа“…»[11]

Керування вебсховищем[ред. | ред. код]

Зберігання об'єктів вебсховища за умовчанням увімкнене у Mozilla Firefox і SeaMonkey, але може бути вимкнене за допомогою «about: config» параметра «dom.storage.enabled» у значення «false».[12]

Mozilla Firefox зберігає усі об'єкти у сховищі в єдиному файлі під назвою webappsstore.sqlite. Команда sqlite3 можна використовувати, щоб показати всі збережені там елементи.[13]

Існують розширення/додатки для Chrome та Mozilla Firefox, що дозволяють користувачам керувати вебсховищем, наприклад «Click&Clean»[14][15] або «BetterPrivacy», котрі можуть регулярно очищати локальне сховище в автоматичному режимі.[16][17][18]

Див. також[ред. | ред. код]

Примітки[ред. | ред. код]

  1. ↑ AndyHume.net, 2011 http://blog.andyhume.net/localstorage-is-not-cookies [Архівовано 2 квітня 2011 у Wayback Machine.]
  2. ↑ Web Storage [Архівовано 21 квітня 2021 у Wayback Machine.]. W3.org
  3. ↑ Mozilla Developer Center: DOM Storage [Архівовано 29 червня 2011 у Wayback Machine.]. Developer.mozilla.org. Retrieved on 2011-06-12.
  4. ↑ [1] [Архівовано 4 березня 2016 у Wayback Machine.]. HTML5 Web Storage in Essence (2011-02-28). Retrieved on 2012-03-30.
  5. ↑ Introduction to Web Storage [Архівовано 24 березня 2017 у Wayback Machine.]. Microsoft Developer Network, msdn.microsoft.com. Retrieved on 2014-08-05.
  6. ↑ W3C: Web Storage draft standard [Архівовано 1 лютого 2011 у Wayback Machine.]. Dev.w3.org (2004-02-05). Retrieved on 2011-06-12.
  7. ↑ W3C: Indexed Database API [Архівовано 2 лютого 2011 у Wayback Machine.]. W3C. Станом на 08.01.2015
  8. ↑ W3C, 2011 http://dev.w3.org/html5/webstorage/ [Архівовано 1 лютого 2011 у Wayback Machine.]
  9. ↑ Mozilla Developer Center: DOM Storage [Архівовано 29 червня 2011 у Wayback Machine.]. Developer.mozilla.org. Retrieved on 2011-06-12.
  10. ↑ MSDN: Introduction to DOM Storage [Архівовано 14 січня 2015 у Wayback Machine.]. Msdn.microsoft.com. Retrieved on 2011-06-12.
  11. ↑ W3C: Web Storage draft standard [Архівовано 1 лютого 2011 у Wayback Machine.]. Dev.w3.org (2004-02-05). Retrieved on 2011-06-12.
  12. ↑ Mozillazine article on disabling Web Storage Objects in about:config. Kb.mozillazine.org. Retrieved on 2011-06-12.
  13. ↑ Firefox's Super Cookies [Архівовано 25 грудня 2016 у Wayback Machine.], Cerias, January 16, 2008
  14. ↑ «Click&Clean» extension for Google Chrome [Архівовано 15 лютого 2017 у Wayback Machine.]. Hotcleaner.com (2011-06-01). Retrieved on 2011-06-12.
  15. ↑ "Click&Clean add-on for Mozilla Firefox [Архівовано 4 вересня 2014 у Wayback Machine.]. Addons.mozilla.org. Retrieved on 2011-06-12.
  16. ↑ Mozilla add-ons page for «Better Privacy» [Архівовано 4 вересня 2014 у Wayback Machine.]. Addons.mozilla.org. Retrieved on 2011-06-12.
  17. ↑ Homepage of «Better Privacy», with some further references to blogs and articles [Архівовано 23 серпня 2011 у Wayback Machine.]. Netticat.ath.cx. Retrieved on 2011-06-12.
  18. ↑ Google Chrome Browser Client-Side Storage [Архівовано 22 листопада 2016 у Wayback Machine.]. Hotcleaner.com. Retrieved on 2011-06-12.

Посилання[ред. | ред. код]

 
Можливості · стандарти · протоколи
Можливості
Вебстандарти
Протоколи
 
Діючі
На основі Blink
На основі Gecko
На основі WebKit
Інші
 
Розробку припинено
На основі Gecko
На основі MSHTML
На основі WebKit
Інші
  • Категорія Категорія
  • Порівняння

    • Товстим шрифтом виділені популярні браузери
    Отримано з https://uk.wikipedia.org/w/index.php?title=Web_Storage&oldid=41746977