Обрезать изображения с помощью загрузки файла jQuery

Я только начал реализовывать функцию загрузки файлов, и мне было интересно, как лучше всего добавить функцию обрезки.

По сути, я хочу, чтобы пользователи могли обрезать свои изображения в соответствии с моим заданным соотношением сторон. В настоящее время у меня есть функциональная загрузка файлов с использованием плагина загрузки файлов jQuery. Когда я выбираю файл, он автоматически загружает файл на мой сервер через ajax и выполняет некоторые действия (сохраняет изображение, создает эскизы и т. д.). Я проверил некоторые плагины в отношении функциональности обрезки внешнего интерфейса и обнаружил, что jQuery imgareaselect соответствует моим требованиям.

Итак, мой вопрос: как мне подогнать логику обрезки к тому, что у меня есть сейчас? Поэтому, когда пользователь загружает файл, файл автоматически загружается и сохраняется в бэкэнде. Итак, если я решу обрезать изображение, должно ли оно отправлять только координаты и повторно обрезать уже сохраненные изображения?

Некоторый логический поток и примеры были бы очень полезны. Спасибо!


person gerky    schedule 24.12.2013    source источник
comment
Если вы отправляете полное изображение на сервер, независимо от того, что вы можете захотеть, просто отправьте координаты кадрирования на сервер, и пусть сервер позаботится об этом. Однако, если вам не нужна поддержка старых браузеров, вы можете выполнить обрезку в браузере перед отправкой изображения на сервер с помощью файлового API HTML5, тем самым сэкономив пропускную способность и объем памяти.   -  person Thayne    schedule 24.12.2013
comment
@Thayne Я планирую поддерживать старые браузеры. Вы говорите, что я должен отправить координаты обрезки через другой запрос (не связанный с загрузкой файла jquery), а затем обрезать изображение на бэкэнде?   -  person gerky    schedule 24.12.2013
comment
Вероятно, есть и другие способы сделать это, например, вы можете заставить сервер отправить обратно изображение или URL-адрес изображения и манипулировать им, но если вы хотите поддерживать IE9 или более раннюю версию, отправка координат и обрезка в бэкэнд наверное самое простое решение.   -  person Thayne    schedule 24.12.2013
comment
Вы также можете использовать что-то вроде флэш-памяти или (мне немного не по себе) серебряного света или даже Java-апплета.   -  person Thayne    schedule 24.12.2013
comment
Ясно, да, я думаю, что отправлю координаты и просто сделаю кадрирование в бэкэнде. Вы можете опубликовать свой комментарий в качестве ответа, если хотите, чтобы я мог его принять. Спасибо!   -  person gerky    schedule 24.12.2013


Ответы (1)


Если вы не хотите отправлять два запроса. Вы можете создать тег img и загрузить свое изображение через JavaScript и открыть изображение для обрезки. Jcrop также является хорошим инструментом для обрезки изображений, который принимает соотношение сторон в качестве параметра. Который возвращает выбранные вами координаты. И вы можете передать изображение и координаты за один раз.

person Anuja    schedule 03.01.2015