html5+php调用android手机图片,html5+exif.js+canvas+php实现手机上传图片,图片损坏无法打开...

上传图片,图片损坏无法打开,图片路径也是正确的,

function selectFileImage(fileObj) {

var file = fileObj.files['0'];

//图片方向角 added by lzk

var Orientation = null;

if (file) {

console.log("正在上传,请稍后...");

var rFilter = /^(image\/jpeg|image\/png)$/i; // 检查图片格式

if (!rFilter.test(file.type)) {

//showMyTips("请选择jpeg、png格式的图片", false);

return;

}

// var URL = URL || webkitURL;

//获取照片方向角属性,用户旋转控制

EXIF.getData(file, function() {

// alert(EXIF.pretty(this));

EXIF.getAllTags(this);

//alert(EXIF.getTag(this, 'Orientation'));

Orientation = EXIF.getTag(this, 'Orientation');

//return;

});

var oReader = new FileReader();

oReader.onload = function(e) {

//var blob = URL.createObjectURL(file);

//_compress(blob, file, basePath);

var image = new Image();

image.src = e.target.result;

image.onload = function() {

var expectWidth = this.naturalWidth;

var expectHeight = this.naturalHeight;

if (this.naturalWidth > this.naturalHeight && this.naturalWidth > 800) {

expectWidth = 800;

expectHeight = expectWidth * this.naturalHeight / this.naturalWidth;

} else if (this.naturalHeight > this.naturalWidth && this.naturalHeight > 1200) {

expectHeight = 1200;

expectWidth = expectHeight * this.naturalWidth / this.naturalHeight;

}

var canvas = document.createElement("canvas");

var ctx = canvas.getContext("2d");

canvas.width = expectWidth;

canvas.height = expectHeight;

ctx.drawImage(this, 0, 0, expectWidth, expectHeight);

var base64 = null;

//修复ios

if (navigator.userAgent.match(/iphone/i)) {

console.log('iphone');

//alert(expectWidth + ',' + expectHeight);

//如果方向角不为1,都需要进行旋转 added by lzk

if(Orientation != "" && Orientation != 1){

alert('旋转处理|'+Orientation);

switch(Orientation){

case 6://需要顺时针(向左)90度旋转

alert('需要顺时针(向左)90度旋转');

rotateImg(this,'left',canvas);

break;

case 8://需要逆时针(向右)90度旋转

alert('需要顺时针(向右)90度旋转');

rotateImg(this,'right',canvas);

break;

case 3://需要180度旋转

alert('需要180度旋转');

rotateImg(this,'right',canvas);//转两次

rotateImg(this,'right',canvas);

break;

}

}

/*var mpImg = new MegaPixImage(image);

mpImg.render(canvas, {

maxWidth: 800,

maxHeight: 1200,

quality: 0.8,

orientation: 8

});*/

base64 = canvas.toDataURL("image/jpeg", 0.8);

}else{

if(Orientation != "" && Orientation != 1){

//alert('旋转处理');

switch(Orientation){

case 6://需要顺时针(向左)90度旋转

alert('需要顺时针(向左)90度旋转');

rotateImg(this,'left',canvas);

break;

case 8://需要逆时针(向右)90度旋转

alert('需要顺时针(向右)90度旋转');

rotateImg(this,'right',canvas);

break;

case 3://需要180度旋转

alert('需要180度旋转');

rotateImg(this,'right',canvas);//转两次

rotateImg(this,'right',canvas);

break;

}

}

base64 = canvas.toDataURL("image/jpeg", 0.8);

}

// var str="

%22%20+base64+%20%22
";

// $(".img_add").append(str);

// uploadImage(base64);

$('#myupload').ajaxSubmit({

data:{'img':base64},

dataType: 'json',

success: function (data) {

if(data.error!='0'){

alert(data.error);

}

if(data.pic){

var pic=data.pic;

if (pic.substring(0,1)=='.'){

s=pic.substring(1);

}

var str="

%22%20+s+%20%22
";

$(".img_add").append(str);

}

},

error: function () {

alert('上传失败');

},

})

$("#img_add").attr("src", base64);

};

};

oReader.readAsDataURL(file);

}

}

php上传服务器部分

public function uploadimg(){

$opensession=$this->opensession;

$path = './Public/Uploads/Friends/'.$opensession['openid']."_".$_POST['openid']."/";//上传路径

if (isset($_POST)) {

$img = $_POST['img'];

$img = str_replace('data:image/png;base64,', '', $img);

$img = str_replace(' ', '+', $img);

$data = base64_decode($img);

$pic_name = time() . rand(10000, 99999) . ".png" ;//图片名称

$pic_url = $path . $pic_name;//上传后图片路径+名称

if (file_put_contents($pic_url, $data)) { //临时文件转移到目标文件夹

echo json_encode(array("error"=>"0","pic"=>$pic_url,"name"=>$pic_name));

} else {

echo json_encode(array("error"=>"上传失败!"));

}

}

}

大神 ,请问这是什么原因

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值