版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/Bepthslowly/article/details/88368559
注意顺序不要变哈
<Component> <input type="hidden" id="image" name="image"> <img style="width: 40%;display: block" class="imagePreview" src="{{asset("assets/img/no_image.png")}}" id="imgLogo"> <input id="uploadImg" name="file_upload" onchange="imgUpload(this,'group')" type="file" class="btn btn-default"> </Component>
function imgUpload(event,folder){ var fileid = $(event).attr("id"); var data = { 'file_path' : folder }; uploadFile("#"+fileid,data,function(res,fileid){ console.log(fileid+"adfasdfasdfasdfasdfasdfas"); if(res.error==0){ $(fileid).prev().attr("src",res.data.base_url+res.data.url); $(fileid).prev().val(res.data); }else{ alert(res.msg); } }); } function uploadFile(fileid,data,callBack){ var file = $(fileid)[0].files[0];//File对象; if(file.size/(1024*1024)>8){ alert("文件太大"); return; } var formData = new FormData(); formData.append("data",data); formData.append("name", "我曾经跨过山河大海,也穿过人山人海"); formData.append("file", file); $.ajax({ type: 'post', async : false, url: "/upload", data: formData, processData: false, contentType: false, success:function (data) { callBack(data,fileid); }, error:function () { alert("上传失败"); } }) }
后端:
public function upload(Request $request){ if($request->ajax()){ try{ $file = $request->file('file'); if($file->isValid()){ $res = Media::uploadImage("group",$file); return $res; } }catch(\Exception $e){ return ['error'=>'1', 'msg'=>$e]; } } return ['error'=>'1', 'msg'=>'不听话了小子?']; }
public static function uploadImage($folder,$file) { $extension = $file->getClientOriginalExtension(); if (!in_array($extension, ["png", "jpg", "gif"])) { return ['error'=>'1', 'msg'=>'图片类型需要是png, jpg 或者 gif.']; } $result = $file->store("group"); if($result){ return [ 'error'=>0, 'msg'=>'上传成功!', 'data'=>[ 'url'=>$result, 'base_url'=>env("COS_BASE_URL") ] ]; } return ['error'=>'1', 'msg'=>'你自己找错吧!']; }
文章来源: https://blog.csdn.net/Bepthslowly/article/details/88368559