//1,第一步读取用户选中的文件function selectedFile(){    var oFile = event.target.files[0];        var fileReader = new FileReader();    fileReader.onload = function(){      var base64URL =  this.result ；      var blob = convertBase64UrlToBlob(base64URL,'image/jpeg');      uploadImage(blob);    }    fileReader.readAsDataURL(oFile)    }//2,第二步将base64图片转换为Blob对象 function convertBase64UrlToBlob(urlData, filetype){            //去掉url的头，并转换为byte            var bytes = window.atob(urlData.split(',')[1]);            //处理异常,将ascii码小于0的转换为大于0            var ab = new ArrayBuffer(bytes.length);            var ia = new Int8Array(ab);            var i;            for (i = 0; i < bytes.length; i++) {                ia[i] = bytes.charCodeAt(i);            }            return new Blob([ab], {type : filetype});}//3,第三步使用formData上传数据function uploadImage(blob){  var formData = new FormData();    formData.append('userProfile',blob);    var xhr = new XMLHttpRequest();    // xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");  // 将参数解析成传统form的方式上传    xhr.open('post', '/upload.php',true); 　　xhr.onload = fn();//上传成功事件监听 　　xhr.onerror = fn(); //上传失败事件监听     xhr.send(formData);    }

 

一种更简便的H5上传方式

var change = function(){        var file = event.target.files[0];        var fileReader = new FileReader();        var toBlob = function(a){            return new Blob([a],{type:file.type})        }        fileReader.onload = function(){            var result = this.result;            var blob = new Blob([result],{type:file.type});            var formData = new FormData();            formData.append('userAvatar',blob,file.name); 　　　　　　　//添加其他表单字段            formData.append('username',document.getElementById("uname").value)            formData.append('pwd',document.getElementById("upwd").value);            $.ajax({                type:"post",                url:"http://localhost:3000/uploads",                async:true,                processData:false,                contentType:false,                data:formData,                timeout:6000,                success:function (data) {                    console.log('upload success')                },                error:function (xhr,text) {                    if(text === 'timeout'){                        xhr.abort();                    }                }            });        }        fileReader.readAsArrayBuffer(file);    }