Можете объяснить отличия между cookie и localStorage в веб-разработке?

Cookie и localStorage — это два способа хранения данных на стороне клиента, но у них есть ключевые отличия:

• Объем хранения: cookie обычно ограничены примерно 4 КБ, localStorage может хранить около 5-10 МБ.
• Доступность: cookie автоматически отправляются на сервер при каждом HTTP-запросе к домену, localStorage доступен только на стороне клиента через JavaScript.
• Время жизни: cookie могут иметь заданный срок жизни (expires), localStorage хранит данные бессрочно, пока не будет очищен вручную.
• Безопасность: cookie могут быть помечены как HttpOnly, что запрещает доступ через JS (повышает безопасность), localStorage всегда доступен через JS.

Пример использования localStorage:

// Сохранение данных
localStorage.setItem('username', 'Ivan');

// Получение данных
const user = localStorage.getItem('username');
console.log(user); // Ivan

Пример установки cookie:

document.cookie = "username=Ivan; expires=Fri, 31 Dec 9999 23:59:59 GMT; path=/";