php 上传文件 使用二进制流,HTML PHP文件上传(四) AJAX异步上传文件二进制数据流...

window.onload = function(){

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

imagesfile.onchange = function (){

var file = imagesfile.files[0];

//判断文件大小不能超过10M ,免去服务器的压力。

if (file.size > 10 * 1024 * 1024) {

alert("上传文件必须 < 10Mb!");

return false;

}

// 获取文件

var reader = new FileReader(); // 实例化

reader.readAsDataURL(file); // 加载

reader.onload = function (){ // 异步加载完成

console.log(reader);

var base64 = reader.result; // 获取 base64 DataURL

var imgDom = document.getElementById("imgtmp");

imgDom.src = base64;

/*imgDom.onload = function () {

//压缩

var canvas = document.createElement('canvas'); // 获取canvas对象

var context = canvas.getContext('2d'); // 获取canvas的上下文

canvas.width = 100;

canvas.height = 100;

context.clearRect(0, 0, canvas.width, canvas.height); // 首先先清空canvas里面的内容,以防内容叠加

context.drawImage(imgDom, 0, 0, canvas.width, canvas.height); // 画图

var base64min = canvas.toDataURL('image/jpeg', 0.92); // 格式和质量

imgDom.src = base64min;

//直接上传图片

//base64_uploading(base64min);

}*/

}

}

}

$('#sub_btn').on('click',function(){

var base64Data = $('#imgtmp').attr('src');

base64_uploading(base64Data);

})

//AJAX上传base64

function base64_uploading(base64Data){

var param1 = '其他参数'; // 可以同时传其他参数

var uploadimg = dataURLtoBlob(base64Data); // base64转二进制数据流

var formData = new FormData(); // 实例化创建form表单

formData.append("uploadimg", uploadimg); // 增加参数

formData.append("param1", param1);// 增加参数

// 执行ajax提交

$.ajax({

url:'upload.php',

dataType:'json',

type:'POST',

async: false,

data: formData,

processData : false, // 使数据不做处理

contentType : false, // 不要设置Content-Type请求头

success: function(data){

console.log(data);

if(data.code == 10000){

alert('上传成功');

}else{

alert('上传失败:'+data.msg);

}

},

error:function(response){

console.log('网络异常:'+response);

}

});

}

//**dataURL to blob**

function dataURLtoBlob(dataurl){

var arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1],

bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);

while (n--) {

u8arr[n] = bstr.charCodeAt(n);

}

return new Blob([u8arr], { type: mime });

}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值