Учебник по использованию LocalStorage в HTML5

Эта статья в основном представляет учебник по использованию LocalStorage в HTML5. LocalStorage используется для локального исходящего взаимодействия между браузером и системой. Друзья, которые нуждаются в этом, могут ссылаться на то, что такое LocalStorage

Несколько дней назад я обнаружил, что в старом проекте была странная операция печенья. После консультации я хотел кэшировать некоторую информацию, чтобы избежать передачи параметров на URL, но я не рассматривал, какие проблемы принесут файлы cookie:

① Размер файла cookie ограничен примерно 4K, что не подходит для хранения бизнес -данных.

② Файлы cookie отправляются с HTTP -транзакциями каждый раз, тратясь впустую полосу пропускания

Мы делаем мобильные проекты, поэтому настоящая технология, подходящая для использования здесь, - это LocalStorage. Можно сказать, что LocalStorage является оптимизацией файлов cookie. Использование его может облегчить хранение данных на стороне клиента и не будет передаваться HTTP, но это не без проблем:

① Размер LocalStorage ограничен около 5 миллионов символов, и каждый браузер не соответствует

② LocalStorage не читается в режиме конфиденциальности

③ LocalStorage - это по сути чтение и написание файлов. Если будет слишком много данных, это будет более застрятельно (Firefox будет импортировать данные в память одновременно, и это будет страшно, если вы подумаете об этом)

④ LocalStorage не может быть заполнено сканерами, не используйте его для полной замены параметров URL

Недостатки не скрывают достоинств, и все вышеперечисленные проблемы можно избежать, поэтому мы должны сосредоточиться на том, как использовать LocalStorage и как правильно их использовать.

Использование LocalStorage

Существует два типа объектов LocalStorage Storage:

① SessionStrage: сессия означает сеанс. Здесь сеанс относится к периоду достоверности объекта сеанса, только так долго, когда пользователь просматривает определенный веб -сайт.

② LocalStorage: Сохраните данные на аппаратном устройстве клиента, независимо от того, что это такое, это означает, что данные все еще будут там в следующий раз, когда вы откроете компьютер.

Разница между ними заключается в том, что одним является временное сохранение, а другим-долгосрочное сохранение.

Вот простой код, чтобы проиллюстрировать его основное использование: