Laravel ajax图片上传

Laravel ajax图片上传

页面效果

页面代码

<label>商品图片<span>*</span></label>
<input type="text" placeholder="" class="form-control col-md-6" aria-describedby="helpBlock" name="img" hidden>
<input type="file" id="File"/>
<br/>

ajax

$('#File').change(function(e){
            var formData = new FormData()  //创建一个forData
            var file = this.files[0];
            formData.append('img',file);
            $.ajax({
                headers: { 'X-CSRF-TOKEN' : '{{csrf_token()}}'},
                type: 'POST',
                url: '/admin/goodsImg' ,
                data: formData,
                contentType: false,
                processData: false,
                success:function(data){
                    var url = window.location.protocol+"//"+window.location.host+data;
                    $('#File').next().next().next().attr({'src':url});
                    $('#File').next().next().next().css({'margin':'3% 0 3% 0'});
                    $('#File').prev().attr('value',data);
                },
                error:function(err){
                    console.log(err);
                }

            });
        });

控制器

/*
     * 商品图片上传
     *
     */
    public function upload(Request $request)
    {
        // 获取上传的文件对象
        $pic = $request->file('img');
        //上传文件夹的路径
        $dirname = './uploads/goods/';
        // 获取上传的文件的后缀
        $ext = $pic->getClientOriginalExtension();
        // 拼装出你需要使用的文件名
        $picname = trim($dirname,'.').time().rand(100000,999999).'.'.$ext;
        // 移动临时文件，生成新文件到指定目录下
        $pic->move($dirname,$picname);

        return $picname;
    }