Как сохранить Cookie?

Question

[VitaliyKaliuzhyn]

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

<div class="dz-image"><img data-dz-thumbnail="" alt="screenshot.png" src="someurl"></div>

Answer 1

[Алексей Уколов]

Лучше хранить не в куках, а в LocalStorage - куки пересылаются между сервером и клиентом при каждом запросе-ответе, ни к чему их раздувать. Вдобавок, у кук серьёзно ограничен максимальный объём - обычно не более 5 Мб.
Вот пример конвертации изображения в бинарный формат и его последующего рендеринга: https://jsfiddle.net/alexey_m_ukolov/fnjsubkm/
Как работать с localStorage описано по ссылке.

Comments

[VitaliyKaliuzhyn]

Хорошо LocalStorage, но это не проясняет ситуацию как мне сохранить превьюшку

[Алексей Уколов]

VitaliyKaliuzhyn: опишите яснее, какая последовательность должна быть - в какой момент создаётся превью и где его нужно показывать?

[VitaliyKaliuzhyn]

Алексей Уколов: Я перетаскиваю картинку на поле и сразу же стартует загрузка картинки на сервер. После успешной загрузки здесь появляется превьюшка, тоесть пока картинка не загружена на сервер тега img не существует.

<div class="dz-image"><img data-dz-thumbnail="" alt="screenshot.png" src="someurl"></div>

. Но после перезагрузки страницы первьюшка исчезает, хотя картинка остается на сервере и доступно по урлу

[Алексей Уколов]

Так вам, скорее, надо просто с сервера отдавать корректную разметку и превью генерировать на сервере (или отдавать в качестве превью оригинальную картинку). Вы сейчас чего-то очень странного желаете.

[VitaliyKaliuzhyn]

Алексей Уколов: мне надо что то такое https://blueimp.github.io/jQuery-File-Upload/

[Алексей Уколов]

Я понимаю, но превью - это просто обычная картинка. Первоначальное отображение в браузере, до загрузки на сервер - это отдельная задача, но у вас она уже решена. После того, как картинка сохранена на сервере, вы можете делать с ней что хотите - ресайзить, кропать, вращать. Вот и уменьшите до нужного размера, сохраните копию и отдавайте её как обычную картинку. И не нужны будут никакие костыли на клиенте.