Question

我需要在不使用html表单标签的情况下在服务器上上传图片。有这么简单吗？实际上，我一直在构建一个应用程序，允许用户上传他的照片或从网络摄像头拍摄一张新照片，如果用户点击上传按钮，那么照片将移动到服务器。当用户上传图片和按上传按钮时，它工作正常，因为我一直在使用带有type ='file'的HTML输入标签，但是当我从网络摄像头拍摄照片并在HTML5画布标签上渲染时，我点击上传按钮，没有图片移动到服务器，因为输入标记中没有文件。在这两种情况下，我使用相同的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";
    }

制作HTTPrequest的Javascipt代码

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

如果没有表单标记，则无法上传。有一些似乎使用Ajax的解决方法，例如iframe或使用Flash。

Answer 3

如果您不想使用表单元素，那么您将如何从用户那里获取输入？您可以使用Flash，Java但它只会让您的工作更加困难。我可能会建议使用表单输入，使用Javascript处理它，然后将其发送到PHP Uploader Script。您可以将用户重定向到该PHP页面并执行操作在那里工作或用AJAX做，并取一个代表你新上传的图像的整数，然后将其插入你的数据库或存储它们的任何地方，并向用户显示他的新图像..

将图像文件上载到服务器而不使用HTML表单元素

3 个答案: