Загрузчик изображений и миниатюр. Новые стандарты, старые проблемы

[fedclud]

Даа… очень удобная штука я гляжу этот HTML5
прям красота, под каждый браузер своя реализация. Блеск!
Всегда именно такую технологию и хотел освоить.

[PoN]

«Это сарказм !?» :)

[Wendor]

Браво Шелдон!

[ShpuntiK]

Отличная технология, но как и любая не без погрешностей.

[fedclud]

Даааа. Это фигня…
Вот когда будет разный код под разные процы вот тогда мы похохочем!
А это так мелочи!

[fedclud]

вот это пофиг, главно его самому не писать :)))

[mrjj]

Ага, учитывая процент аудитории IE+Safari, то это все полезно только теоретически. Еще обязательно нужно добавить превью файлов с помощью canvasGL, чтобы к статье можно было смело дописать тег «экзотика»

Полагаю, что ближайшие 5 лет я продолжу пользовать в проектах qq.FileUploader и не париться, а подобные публикации пропускать.

Боюсь что, подавляющее большинство возможностей т.н. html5 придется еще долгое время игнорировать, а когда они либо сдохнут либо получат полноценные спецификации и поддержку со стороны браузеров, ну да, потрачу аж 15 минут на изучение.

[Alvaro]

Вы считаете, что в наших родных краях процент IE+Safari так велик?

[mrjj]

Края не имеют значения, важна аудитория, если она у вас блика к меилсрушечке, то ваше решение будет поддерживаться только у 1/5 пользователей.
По данным tx3, хотя они и несколько смещенные, но рунет отображают неплохо, чуть лучше, заработает где-то 1/3 пользователей.

Пользователь не станет ставить другой браузер, чтобы посетить ваш сайт. И возвращаться если что-то не заработало тоже вряд ли будет.

Впрочем, я не знаю зачем я тут все это пишу. Ваш проект — ваши проблемы.

[Alvaro]

Конечно. Однако я тут нигде не писал, что нужно использовать только это решение(а даже намекал на обратное). Например, в связке с флешем всё будет отлично работать.

[fedclud]

К сожалению, согласен с тобой полностью. Такой html5 мне лично не нужен, будем ждать.

[Smerig]

Значит в сафари нельзя ниче сделать, как и в ИЕ, но сафари рассматриваем :)
А вообще способ для сафари подходит для любого браузера, даже для ИЕ.
Писал статью как-то www.clearboth.ru/article/ajax-image-preview-before-upload.html
Код сыроват, но работает.

[Alvaro]

Способ для Сафари к IE не подойдет, так как мы не можем получить даже список файлов, не то что передать их на сервер

[Smerig]

Может неправильно понял, но ведь имена файлов в ИЕ нам известны: c:/fakepath/filename.jpg

[Alvaro]

Вы имеете ввиду локальный путь?

[evindor]

По рабочим задачам делали подобное. Для неподдерживаемых браузеров сделали fallback во флеш. На гитхабе сейчас сырая версия, в проекте лежит доработанная, как руки дойдут — обязательно выложим. Честно честно.

[xrays72]

На хабре была статья habrahabr.ru/blogs/webdev/109079/. Читали её?

[Alvaro]

Да, читал. Однако как работать с миниатюрами, там не описано. А это оказалось самым сложным.

[xrays72]

А как же это: "… Метод readAsDataURL() объекта FileReader принимает параметром объект File и запускает чтение данных из него. В результате для всех выбранных через стандартное поле или перетащенных прямо в браузер картинок, мы видим их миниатюры (искусственно уменьшенные до 150 пикселей)..."?

// Создаем объект FileReader и по завершении чтения файла, отображаем миниатюру и обновляем
// инфу обо всех файлах
var reader = new FileReader();
reader.onload = (function(aImg) {
return function(e) {
aImg.attr('src', e.target.result);
aImg.attr('width', 150);
log('Картинка добавлена: `'+file.name + '` (' +Math.round(file.size / 1024) + ' Кб)');
imgCount++;
imgSize += file.size;
updateInfo();
};
})(img);

reader.readAsDataURL(file);

[Alvaro]

Видеть-то видим, но переслать на сервер не можем

[Demetros]

e.target.result содержит закодированное в base64 содержимое файла

[Alvaro]

Да, конечно, я так и делал. Но отсылать на сервер файл в виде строки, да ещё закодированной? В принципе, в моей статье описывается решение одной проблемы: как данные миниатюры отправить так, чтобы на сервере можно было их легко получить и сохранить(например, используя массив $_FILES).

[Demetros]

Прошу прощения, неправильно понял.
Статья хорошая, чужой опыт всегда интересен и может пригодиться в будущем.

[xfather]

Неплохо бы приложить рабочий пример

[Alvaro]

Я над этим работаю. Скоро будет

[fedclud]

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

[Alvaro]

Будет пример. Сегодня не смогу — работа, пятница, отдых. А завтра, надеюсь, выложу и здесь кину ссылку

[Denai]

В примере просто зелёная кнопка загрузки, которая ничего не делает кроме выбора файлов, так и должно быть? FF 8.0

[Alvaro]

Выбираются файлы, ресайзятся и отправляются на сервер. Если сервер есть. Если сервера нет, то ничего не происходит. Код для сервера я привел здесь

[Alvaro]

Напомню, что основная цель моего загрузчика — загрузить на сервер файл и его миниатюру.

[mrjj]

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

[Alvaro]

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

[mrjj]

Сколько же их вам загружают в секунду?!
Обычно это не есть узкое место.

[Alvaro]

А если изображение, к примеру, хорошего качества(например 2900x1500). Это бывает в веб-галерее. Тогда оперативной памяти может и не хватить

[mrjj]

Да чтож за железо-то такое. Если реально поджмает пользуй EPEG, хотя качество сжатия у него посредственное.

В любом случае это как экономия на ручках и пакетиках чая.

[Alvaro]

Не согласен. Я столкнулся с этой проблемой в реальной задаче. А так как переплачивать за хостинг мне не хотелось, то я решил перенести затраты оперативы на клиент. Правда, в той задаче я использовал flash, но подход тот же.

[JohnnyD]

Это статья о прелестях, прелестях подземных будней.