前端:
注意顺序不要变哈
<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'=>'你自己找错吧!'];
}