Сохранение локального образа или пути изображения в локальном хранилище?

Question

Я работаю над букмарклетом (Javascript, который запускается из закладки), который накладывает изображение на веб-страницу, чтобы проверить, соответствует ли html проекту. (он использует непрозрачность)

Я хочу сохранить ссылочное изображение на основе каждого URL-адреса. У меня есть три варианта, насколько я знаю:

• сохранить путь в куки
• сохранить путь в локальном хранилище
• сохранить изображение в локальном хранилище

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

Каков наилучший подход?

Answer 1

Уверенный, вы можете сохранять изображения и/или URL-адрес до localStorage.

Однако, поскольку localStorage занимает string вам нужно сначала преобразовать изображение в data-url либо служа изображение, например с сервера, или преобразовать изображение с использованием canvas (обратите внимание, что полотно может нормально только набор изображений из то же самое происхождение, и, конечно, холст недоступен в IE7 без полизаполнения).

Возможно, лучше использовать indexedDB или новый File API (в настоящее время плохо поддерживается, пока что доступен только Chrome), который позволяет запрашивать большое пространство для хранения и может сохранять изображение напрямую (как Blob).

Изображения будут сохранены при их обслуживании (кроме случаев, когда вы повторно масштабируете и повторно сжимаете с помощью jpeg in canvas), поэтому пикселизация или снижение качества не должны быть проблемой.

IE7 does not support localStorage поэтому в этом случае вам нужно будет вернуться на UserData (ограничено до 4 мб IIRC) или файлов cookie с url.

Хотя -

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

Таким образом, он остается в кеше до тех пор, пока пользователь не удалит его или не истечет. У вас есть ограничение на трафик на ваш сервер, тогда localStorage/indexedDB, вероятно, лучший вариант.