Heim > Artikel > Backend-Entwicklung > 手机压缩图片通过base64 上传 ajax不能post
<!DOCTYPE html><html><head> <meta charset="utf-8"/> <title>测试上传文件</title> <script type="text/javascript" src="js/jquery.min.js"></script> <script type="text/javascript" src="../js/mobileFix.mini.js"></script> <script type="text/javascript" src="../js/exif.js"></script> <script type="text/javascript" src="../js/lrz.js"></script></head><style> body { margin: 20px 20%; color: #777; text-align: center;}</style><body><hr/><input type="file" accept="image/*"/><hr/><script type="text/javascript"> var input = document.querySelector('input'); input.onchange = function () { lrz(this.files[0], {width: 800, height: 600,quality:0.5, before: function(){}, fail: function(){}, done: function (results) { // 你需要的数据都在这里,可以以字符串的形式传送base64给服务端转存为图片。 var img = new Image(); $('body').append(img); // 发送到后端 var xhr = new XMLHttpRequest(); var data = { base64: results.base64, size: results.base64.length // 校验用,防止未完整接收 }; xhr.open('POST', '1.php'); xhr.setRequestHeader('Content-Type', 'application/json; charset=utf-8'); xhr.onreadystatechange = function () { if (xhr.readyState === 4 && xhr.status === 200) { var result = JSON.parse(xhr.response); result.error ? alert('服务端错误,未能保存图片') //: demo_report('服务端实存的图片', result.src, result.size); : img.src = result.src; } }; xhr.send(JSON.stringify(data)); // 发送base64 }, always: function(){ } } )};</script></body></html>
<?php$base64=file_get_contents("php://input"); //获取输入流$base64=json_decode($base64,1);$data = $base64['base64'];preg_match("/data:image\/(.*);base64,/",$data,$res);$ext = $res[1];if(!in_array($ext,array("jpg","jpeg","png","gif"))){ echo json_encode(array("error"=>1));die;}$file=time().'.'.$ext;$data = preg_replace("/data:image\/(.*);base64,/","",$data);if (file_put_contents('../uploadFiles/'.$file,base64_decode($data))===false) { echo json_encode(array("error"=>1));}else{ echo json_encode(array("error"=>0,'src'=>'../uploadFiles/'.$file));}
只要有一种客户端能够上传成功,就表示代码没有大问题。有的只是兼容性问题
既然已经使用了 jQuery,那为何不使用它提供的 ajax?至少兼容性工作他已替你做好了
同意版主
你在安卓微信浏览器上测试的时候就会发现这个不是个例 有些是因为封了上传
只要有一种客户端能够上传成功,就表示代码没有大问题。有的只是兼容性问题
既然已经使用了 jQuery,那为何不使用它提供的 ajax?至少兼容性工作他已替你做好了
同意版主
你在安卓微信浏览器上测试的时候就会发现这个不是个例 有些是因为封了上传
直接使用jquery吧,这样可以更好解决兼容问题。
这段代码没有问题,上传到阿里云之后,我的手机用自身的4G流量没有问题,家里wifi也没有问题,唯独单位wifi有问题。
还测试过小米4,三星s6等手机,单位wifi也没有问题。
据说华为p6有大小限制。而我测试的上述手机没有大小限制。
神一样的安卓?