laravel-文件上传处理

laravel文档中关于文件上传的资料很少，这里实现一个ajax上传：

html内容：

upload.blade.php

@extends('layout.default')
@section('title', '注册')
@section('content')
<!--上传界面-->
<div class="col-md-offset-2 col-md-8">
  <div class="panel panel-default">
    <div class="panel-heading">
      <h5>上传</h5>
    </div>
    <div class="panel-body">
        @include('shared.upload_image')
        <div class="form-group row">
            <label class="col-md-2 control-label">图片一</label>
            <div class="col-md-4 thumb-wrap">
                <div class="pic-upload btn btn-block btn-info btn-flat" title="点击上传">点击上传</div>
                <img id="test_upload" src="" height="100px"  />
                <input type="hidden" name="test_upload" value="" />
            </div>
        </div>
        <div class="form-group row">
            <label class="col-md-2 control-label">图片二</label>
            <div class="col-md-4 thumb-wrap">
                <div class="pic-upload btn btn-block btn-info btn-flat" title="点击上传">点击上传</div>
                <img id="test_upload2" src="" height="100px"  />
                <input type="hidden" name="test_upload2" value="">
            </div>
        </div>
    </div>
  </div>
</div>
@stop

upload_image.blade.php

<!-- 上传图片弹出层div /S-->
<div class="upload-mask">
</div>
<div class="panel panel-info upload-file">
    <div class="panel-heading">
        上传图片
        <span class="close pull-right">关闭</span>
    </div>
    <div class="panel-body">
        <div id="validation-errors"></div>
        {!! Form::open( array('url' =>['/upload'], 'method' => 'post', 'id'=>'imgForm', 'files'=>true) ) !!}
        <div class="form-group">
            <label>图片上传</label>
            <span class="require">(*)</span>
            <input id="thumb" name="file" type="file"  required="required">
            <input id="imgID"  type="hidden" name="id" value="">
        </div>
        {!!Form::close()!!}
    </div>
    <div class="panel-footer">
    </div>
</div>
<!-- 上传图片div /E-->

路由：

//上传
Route::get('/upload', 'UsersController@showUpload');
Route::post('/upload', 'UploadController@imgUpload')->name('upload');

PHP：

showUpload方法

//显示上传页
    public function showUpload()
    {
        return view('users.upload');
    }

<?php
/* 图片上传 */
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Http\Requests;
use App\Http\Controllers\Controller;
//上传相关
use Redirect, Input, Response;

class UploadController extends Controller
{
    //Ajax上传图片
    public function imgUpload(){
        $file = Input::file('file');
        $id = Input::get('id');
        $allowed_extensions = ["png", "jpg", "gif"];
        if ($file->getClientOriginalExtension() && !in_array($file->getClientOriginalExtension(), $allowed_extensions)) {
            return Response::json(['success' => false,'error' => '你只能上传png,jpg或者gif']);
        }
        $destinationPath = 'uploads/images/';
        $extension = $file->getClientOriginalExtension();
        $fileName = str_random(10).'.'.$extension;
        $file->move($destinationPath, $fileName);
        return Response::json(
            [
                'success' => true,
                'pic' => asset($destinationPath.$fileName),
                'id' => $id
            ]
        );
    }
   
}

JS内容：

<script src="/js/jquery.form.js"></script>
<script src="/js/upload.js"></script>

upload.js

/* upload image */
$(function(){
    $('.upload-mask').on('click',function(){
        $(this).hide();
        $('.upload-file').hide();
    })
    $('.upload-file .close').on('click',function(){
        $('.upload-mask').hide();
        $('.upload-file').hide();
    })
    var imgSrc = $('.pic-upload').next().attr('src');
    console.log(imgSrc);
    if(imgSrc == ''){
        $('.pic-upload').next().css('display','none');
    }
    $('.pic-upload').on('click',function(){
        $('.upload-mask').show();
        $('.upload-file').show();
        console.log($(this).next().attr('id'));
        var imgID = $(this).next().attr('id');
        $('#imgID').attr('value',imgID);
    })
    
    //ajax 上传
    $(document).ready(function() {
        var options = {
            beforeSubmit:  showRequest,
            success:       showResponse,
            dataType: 'json'
        };
        $('#imgForm input[name=file]').on('change', function(){
            //$('#upload-avatar').html('正在上传...');
            $('#imgForm').ajaxForm(options).submit();
        });
    });
    function showRequest() {
        $("#validation-errors").hide().empty();
        $("#output").css('display','none');
        return true;
    }
    function showResponse(response)  {
        if(response.success == false){
            var responseErrors = [response.error];
            $.each(responseErrors, function(index, value){
                if (value.length != 0){
                    $("#validation-errors").append('<div class="alert alert-error"><strong>'+ value +'</strong><div>');
                }
            });
            $("#validation-errors").show();
        } else {
            $('.upload-mask').hide();
            $('.upload-file').hide();
            $('.pic-upload').next().css('display','block');
            console.log(response.pic);
            $("#"+response.id).attr('src',response.pic);
            $("#"+response.id).next().attr('value',response.pic);
        }
    }
})

提示：如果你的laravel没有安装form组件，那么可以直接写form标签

{!! Form::open( array('url' =>['/upload'], 'method' => 'post', 'id'=>'imgForm', 'files'=>true) ) !!}

以上是全部代码