Подтвердить что ты не робот

Загружайте и обрезайте изображение перед отправкой на сервер

Есть ли некоторые клиентские компоненты (jquery/swf), которые позволят загружать и обрезать (пользователь должен иметь возможность выбрать область для обрезки) изображение в браузере, а затем отправить обрезанное изображение на сервер?

Я на asp.net-mvc (не уверен, если это имеет значение)

4b9b3361

Ответ 1

jcrop

Jcrop - это быстрый и простой способ добавления функций обрезки изображения в ваше веб-приложение. Он сочетает в себе простоту использования типичного плагина jQuery с мощным кросс-платформенным механизмом обрезки DHTML, который отлично подходит для привычных графических приложений для настольных компьютеров.

Ответ 2

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

В ответе здесь представлено расширение Jcrop, которое обрезает изображение в браузере и загружает его обрезанный образ на сервер. "Он использует плагин Jcrop для обрезки изображений, рисует обрезанную область в элементе холста HTML 5, преобразует холст в блокнот и загружает файл изображения на сервер AJAX".

Наиболее важной частью является функция canvasToBlob, которая преобразует элемент canvas HTML 5 в тип Blob, который может быть загружен на сервер в виде изображений. К сожалению, этот метод работает только в AJAX и не может напрямую отправить форму, потому что blob не может быть помещен в стандартный элемент HTML-формы в качестве входного файла. На самом деле мы редко используем форму для отправки изображений непосредственно при их обрезке.

Ответ 3

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

Пользовательский интерфейс обрезки является общим, но загрузчик трудно найти. Я рекомендую обрезать UI ImgAreaSelect, который прост в использовании, и этот Uploader, который является простым и расширяемым, но он не является бесплатным.