Загрузить элемент canvas в веб-сервер/базу данных?

Я ищу хороший способ загрузить элемент canvas из Firefox в веб-сервер или базу данных, чтобы иметь возможность перезагрузить его позже.

Мои идеи: 1. Моя первая идея состояла в том, чтобы использовать getImageData() и сохранить холст в качестве объекта ImageData в базе данных, но это может быть не очень хорошее решение, потому что эти объекты могут быть довольно большими. Вторая идея заключается в использовании метода Flash/Javascript для загрузки холста в виде PNG на веб-сервер.

Есть ли у вас какие-либо комментарии по этим методам или, может быть, есть еще одно хорошее решение?

Ответ 1

Элементы Canvas имеют функцию toDataURL, которая сериализует изображение на холсте как PNG, закодированную в URL-адрес . Вы можете отправить изображение с помощью формы (путем установки значения скрытого входного элемента в URL-адрес данных) или в фоновом режиме с помощью AJAX.

Вы должны знать, что toDataURL (или любой другой способ получения данных пикселя) выдает исключение безопасности, если холст не является "источником-чистым". Например, если вы когда-либо вызывали drawImage с изображением из другого домена, вы больше не можете использовать функции toDataURL или getImageData.

Ответ 2

Я не слишком уверен, что буду беспокоиться о размере, если только изображения не будут размером > 10 МБ. Это действительно проблема?

Если нет, использование getImageData() было бы самым практичным и простым методом IMO.