laravel 图片上传|laravel from图片上传 | laravel ajax图片上传

laravel 图片上传|laravel from图片上传 | laravel ajax图片上传

一 、 form图片上传

html代码:

<div class="container">
<div class="panel-heading">上传文件</div>
<form class="form-horizontal" method="POST" action="" enctype="multipart/form-data">
{{ csrf_field() }}
<label for="file">选择文件</label>
<input id="file" type="file" class="form-control" name="source" required>    
<button type="submit" class="btn btn-primary">确定</button>
</form>
</div>

php代码:

public function upload(Request $request){
   	
   		
    $fileCharater = $request->file('source');
    if ($fileCharater->isValid()) { //括号里面的是必须加的哦
    //获取文件的扩展名 
    $ext = $fileCharater->getClientOriginalExtension();
    //获取文件的绝对路径
    $path = $fileCharater->getRealPath();
    //定义文件名
    $filename = date('Y-m-d-h-i-s').'.'.$ext;
    //存储文件。disk里面的public。总的来说,就是调用disk模块里的public配置
    Storage::disk('public')->put($filename, file_get_contents($path));
      
}

OK form表单上传的可以了! 

二、 ajax上传 

1、ajax base64流上传方法
html代码:

<div class="user_input up_img_img">
    <div class="img_input" >
        <img src="" >
    </div>
    <input type="file" class="up_img_input" id="up_img_input">
</div>
<script>
$(document).ready(function(){
    $(".up_img_input").change(function(){
        //实现在页面展示图片 不直接展示base64 页面容易卡
        $(".img_student").attr('src',getObjectURL(this.files[0]));
        var reader = new FileReader();
        var file = this.files[0];
        extStart = file.name.lastIndexOf(".");
        var ext = file.name.substring(extStart,file.name.length).toUpperCase();
        reader.readAsDataURL(file)
        reader.onload = function(e) {
            $.post("/upload", {
                "_token": "{{ csrf_token() }}",
                "img_base64": this.result, //base64流
            }, function (res) {
                if (res.code == 200) {
                    alert('成功');
                } else {
                    alert('失败');
                }
            }, "json");
        }
    });
});
//获取图片路劲的方法,兼容多种浏览器,通过createObjectURL实现
function getObjectURL(file){
    var url = null;
    if(window.createObjectURL != undefined){
        url = window.createObjectURL(file);//basic
    }else if(window.URL != undefined){
        url = window.URL.createObjectURL(file);
    }else if(window.webkitURL != undefined){
        url = window.webkitURL.createObjectURL(file);
    }

    return url;
}
</script>

php代码:

public function upload_img()
{
    $base_img = Input::get('img_base64', '');
    if (empty($base_img)) return response()->json(array('code' => 201, '图片获取失败'));
    $name = date("YmdHis", time()) . mt_rand(100000, 9999999) . ".jpg"; //重新命名
    $path = public_path('upload_imgs') . '/' . $name;  //路径
    $base_imgs = explode(',', $base_img);//分割
    $flg = file_put_contents($path, base64_decode($base_imgs[1]));
    if ($flg == true) {
        return response()->json(array('code' => 200, 'msg' => 'success')));
    } else {
        return response()->json(array('code' => 201, 'msg' => '上传失败了'));
    }

}

ajax base64上传方法 OK了 可以试试了! 

2、ajax form上传

form上传大概就是用js虚拟个form然后把图片添加form中 然后执行上传 穿后台代码基本和form表单一样

下面是基本的ajax代码供参考:

var formData = new FormData($(".banner-upload"));
$.ajax({
    type: 'POST',
    url: '/uplod' ,
    data: formData ,
    processData:false,
    contentType: false,
    cache: false,
    success:function(data){
        console.log(data);
        if(data.status){
        console.log(data.message);
        }
    },
});

ajaxform上传大概就是这个意思 !

laravel 图片上传|laravel from图片上传 | laravel ajax图片上传


喜欢(0)

评论 抢沙发

表情