下載文件

首先前往 https://gitee.com/cp.net/html5-make-upload-thumb

下載所需文件。注：如果你安裝git,那么可以直接在你本地

git clone https://gitee.com/cp.net/html5-make-upload-thumb

如果沒有安裝,直接下載壓縮包即可！

引入文件

引入文件順序可改變,不過必須先引入Jquery

html端處理

????????javascript?處理????$(function(){????????var?$form?=?$('#j-form');????????var?$file?=?$('#j-file');????????var?$status?=?$('.j-status');????????$file.makeThumb({??????????????width:?400,??????????????height:?400,??????????????//mark:?{padding:?5,?src:?'mark.png',?width:?30,?height:?30},??????????????success:?function(dataURL,?tSize,?file,?sSize,?fEvt)?{????????????????????????//?post?data????????????????????????var?$up?=?$('');????????????????????????$up.insertAfter($file).val(dataURL);????????????????????????$file.remove();????????????????????????var?load?=?layer.open({type:?2,content:?'上傳中'});????????????????????????$.ajax({????????????????????????????url:?"api.php",????????????????????????????data:?$form.serialize(),????????????????????????????method:?"POST",????????????????????????????async?:?true,????????????????????????????dataType?:?"json",????????????????????????????success:?function?(data)?{????????????????????????????????layer.close(load);????????????????????????????????$("#ret").html(data.msg);????????????????????????????????console.log(data);????????????????????????????}???????????????});????????????????//$form.submit();???????????}????????});????})

php端處理

???phpheader('Content-Type:text/html;charset=UTF-8');?//?save??img$img?=?$_POST['base64'];?if?(isset($img))?{?????sleep(5);//休息幾秒?????//#?dataURI?base_64?編碼上傳?手機(jī)端常用方式?????$rootPath?=?'./face/'?.?date('Ymd');$target?=?$rootPath?.?"/"?.?date('Ymd')?.?"_"?.?substr(md5(rand(1,10000)),0,6)?.?".png"?;?????if?(preg_match('/data:([^;]*);base64,(.*)/',?$img,?$matches))?{?????????$img?=?base64_decode($matches[2]);?????????if?(!file_exists($rootPath))?{???????????????mkdir($rootPath,0777,true);?????????}?????????if?(file_put_contents($target,?$img)){?????????????$str?=?"

文件來自api返回:

";?????????????$str?.=?"";?????????????exit(json_encode(array('status'=>1,'msg'=>$str)));?????????}?else?{?????????????exit(json_encode(array('status'=>0,'msg'=>'文件上傳失敗')));?????????}?????}?else?{?????????//?普通上傳?這種方式一般不會(huì)用(原始上傳方式)?????????????$uploadFile?=?$_FILES['upfile'];?????????????$target?=?'tmp1.jpg';?????????if?(isset($uploadFile)?&&?is_uploaded_file($uploadFile['tmp_name'])?&&?$uploadFile['error']?==?0)?{?????????????echo?'filename:?'?.?$uploadFile['name']?.?',?';echo?'type:?'?.?$uploadFile['type']?.?',?';?????????????echo?'size:?'?.?($uploadFile['size']?/?1024)?.?'?Kb';?????????????move_uploaded_file($uploadFile['tmp_name'],?$target);?????????}?else?{?????????????echo?'error:?'?.?$uploadFile['error'];?????????}?????}?}

總結(jié)

以上是生活随笔為你收集整理的gitee最多上传多大文件_H5移动端图片压缩上传，基于Jquery的前端，实现拍照上传，选择相册的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。