使用文件输入类型将图像发送到服务器

时间:2014-08-08 13:27:04

标签: javascript jquery html5

我有一个屏幕,我从相机捕捉视频,拍摄一下。我也有一个文件输入,我想把这个选项设置为从相机捕获的图像,即..snap。

我不想将快照存储为cookie并稍后将其检索,因为它稍后会使用户计算机变得沉重,并且每次都需要清理。

所以代码是

<input type="file" id="visitorphoto" name="visitorPhoto" accept="image/*" capture>

根据此w3 document

使用javascript的任何想法?

谢谢, Abhijeet。

1 个答案:

答案 0 :(得分:11)

使用formData上传文件。 HTML:

<input type="file" id="filechooser">

Javascript代码

function uploadFile() {
    var blobFile = $('#filechooser').files[0];
    var formData = new FormData();
    formData.append("fileToUpload", blobFile);

    $.ajax({
       url: "upload.php",
       type: "POST",
       data: formData,
       processData: false,
       contentType: false,
       success: function(response) {
           // .. do something
       },
       error: function(jqXHR, textStatus, errorMessage) {
           console.log(errorMessage); // Optional
       }
    });
}

兼容性: http://caniuse.com/xhr2