Загрузка картинки со страницы на сервер с помощью JS

Kos · №1

Необходимо реализовать следующее действие на JavaScript:
Загружается страница, на ней расположена картинка, нужно эту картинку передать на сервер php скрипту, не адрес картинки, а именно саму картинку(файл).
Попробывал реализовать с помощью AJAX, но ничего не получилось.
Кто плотно работает с JS, подскажите, что можно придумать.

Lynn · №2

Существует только один способ: отправлять форму обычным POST-ом в скрытый iframe

zibloid · №3

Kos если код заточен только под фф то можно сделать так:

Выделить код

Код:

var img = document.getElementById("img");

var canvas = document.createElement("canvas");
canvas.width = img.width;
canvas.height = img.height;
var context = canvas.getContext('2d');
context.drawImage(img,0,0);

var data = canvas.toDataURL("image/png");

Метод toDataURL() вернет в переменную data строку, закодированую через base64, ее можно передать на сервак... если формат png не подходит можно юзать jpeg canvas.toDataURL("image/jpeg");
Ну а дальше на серваке уже сделать декод строки и все

Можно и так:

Выделить код

Код:

var img = new Image();
img.src="http://www.site.ru/img.png";
img.onload=function()
{
    var canvas = document.createElement("canvas");
    canvas.width = img.width;
    canvas.height = img.height;
    var context = canvas.getContext('2d');
    context.drawImage(img,0,0);
    var data = canvas.toDataURL("image/png");
}

Kos · №4

zibloid, спасибо, попробую, если получится, то это вообще идеальный для меня вариант

Проверил, всё сработало великолепно. :beer:

Отредактировано Kos (24-10-2009 15:10:03)

Полезная информация

№123-10-2009 17:28:01