Загрузка файлов изображений на сервер без использования элемента формы HTML

Question

Мне нужно загрузить картинку на сервер без использования HTML-тега формы.Есть ли просто сделать это.На самом деле, я создавал приложение, в котором пользователю будет разрешено либо загрузить свою фотографию, либо взять новую с веб-камеры, и если пользователь нажмет кнопку загрузки, то фотография перейдет на сервер.Когда пользователь загружает картинку и нажимает кнопку загрузки, она работает нормально, потому что я использовал HTML-тег ввода с type = 'file', но когда я беру фото с веб-камеры и отображаю его на тэге HTML5 canvas, я нажимаю кнопку загрузки, нет перемещения изображенияна сервер, потому что нет файла во входном теге.В обоих случаях я использую один и тот же элемент canvas и тег img, чтобы показать его пользователю.

Есть ли способ загрузки без использования элемента формы или есть способ, которым я могу назначить объект изображения, который яполучить из элемента Canavas в тот же элемент ввода формы ??

все ответы приветствуются

Заранее большое спасибо

код на стороне сервера

    function bytesToSize1024($bytes, $precision = 2) {
    $unit = array('B','KB','MB');
    return @round($bytes / pow(1024, ($i = floor(log($bytes, 1024)))), $precision).' '.$unit[$i];
}

$sFileName = $_FILES['image_file']['name'];
$sFileType = $_FILES['image_file']['type'];
$sFileSize = bytesToSize1024($_FILES['image_file']['size'], 1);

 $target = "upload/"; 
 $target = $target . basename( $_FILES['uploaded']['name']) ; 
 $ok=1;
$error=$_FILES["image_file"]["error"];


$uploaddir = '/var/www/example119/upload/';
$uploadfile = $uploaddir . basename($_FILES['image_file']['name']);

  if(!empty($_FILES))
  {
     if(move_uploaded_file($_FILES['image_file']['tmp_name'], "$target$sFileName")) 
     {
     echo "The file ". basename( $_FILES['image_file']['name']). " has been uploaded...";
     } 
     else {
     echo "Sorry, there was a problem uploading your file. {$error}";
     }
  }
  else
    {
    echo "_files is empty";
    }

Javascipt код для создания HTTP-запроса

function startUploading() {
    // cleanup all temp states

    iPreviousBytesLoaded = 0;
    var oProgress = document.getElementById('progress');
    oProgress.style.display = 'block';
    oProgress.style.width = '0px';

    // get form data for POSTing
    //var vFD = document.getElementById('upload_form').getFormData(); // for FF3
    var vFD = new FormData(document.getElementById('upload_form')); // this is for when user upload from browser box
    var vvFD=document.getElementById('preview1'); //added by TODO to test
    // create XMLHttpRequest object, adding few event listeners, and POSTing our data
    var oXHR = new XMLHttpRequest();        
    oXHR.upload.addEventListener('progress', uploadProgress, false);
    oXHR.addEventListener('load', uploadFinish, false);
    oXHR.addEventListener('error', uploadError, false);
    oXHR.addEventListener('abort', uploadAbort, false);
    oXHR.open('POST', 'example_upload/upload.php');
    //oXHR.send(vFD);
    oXHR.send(vvFD);

    // set inner timer
    oTimer = setInterval(doInnerUpdates, 300);
}

Answer 1

Возможно, вам следует попробовать отправить данные изображения через POST.У него нет ограничений по размеру, и содержимое может иметь любой формат.

Answer 2

Если вы не хотите использовать элементы формы, то как вы собираетесь принимать данные от пользователя?Вы можете использовать Flash, Java, но это только усложняет вашу работу. Я могу порекомендовать использовать ввод формы, обработать его с помощью Javascript, а затем отправить его в сценарий загрузчика PHP. Вы можете перенаправить пользователя на эту страницу PHP и сделатьработать там или сделать это с AJAX и взять целое число, которое будет представлять ваше новое загруженное изображение, затем вставить его в вашу базу данных или где бы вы ни сохранили их и показать пользователю его новое изображение ..

Answer 3

Нет, вы не можете загрузить без тега формы.Есть обходные пути, которые, кажется, используют Ajax, такие как iframe или Flash.