Laravel图像上传使用ajax 500内部服务器错误

问题描述：

我想上传图像使用ajax laravel 5.2.but但我仍然收到错误500内部服务器错误的路线。当我试图上传图像使用AJAX请求浏览器显示正确的路径路径，但仍然没有得到它仍然显示错误给我的原因。Laravel图像上传使用ajax 500内部服务器错误

HTML

<!-- CHANGE AVATAR TAB --> 
         <div class="tab-pane" id="tab_1_2"> 

          <div class="uploadimagediv"></div> 
           {{ Form::open(array('url' => 'admin/avatar','method'=>'post','files'=>'true','id'=>'updateprofileimage')) }} 

           <div class="form-group"> 
            <div class="fileinput fileinput-new" data-provides="fileinput"> 
             <div class="fileinput-new thumbnail" style="width: 200px; height: 150px;"> 
              <img src="http://www.placehold.it/200x150/EFEFEF/AAAAAA&amp;text=no+image" alt=""/> 
             </div> 
             <div class="fileinput-preview fileinput-exists thumbnail" style="max-width: 200px; max-height: 150px;"> 
             </div> 
             <div> 
              <span class="btn default btn-file"> 
              <span class="fileinput-new"> 
              Select image </span> 
              <span class="fileinput-exists"> 
              Change </span> 
              <p class="text-danger" id="error_image"></p> 
              <input type="file" id="picture" name="picture"/> 
              {{--{{ Form::file('picture') }}--}} 
              </span> 
              <span class="error alert-danger">{{ $errors->first('picture') }}</span> 
              <a href="javascript:;" class="btn default fileinput-exists" data-dismiss="fileinput"> 
              Remove </a> 
             </div> 
            </div> 
            <div class="clearfix margin-top-10"> 

            </div> 
           </div> 
           <div class="margin-top-10"> 
            {{Form::hidden('id', 2, ["id"=>"id"])}} 
            {{ Form::button('Upload',['id'=> 'updatepicture','class'=>'btn green-haze']) }} 

            {{--{{ Form::submit('Submit',['class' => 'btn green-haze','name'=>'changeImage']) }}--}} 
            <a href="javascript:;" class="btn default"> 
            Cancel </a> 
           </div> 
          {{ Form::close() }} 
         </div> 
         <!-- END CHANGE AVATAR TAB -->

路线

Route::group(['prefix' => 'admin'], function() 
{ 
    Route::controller('/','DashboardController'); 
});

阿贾克斯

$(document).on('click', '#updatepicture', function($e) 
{ 
    $e.preventDefault(); 
    // send an ajax request 
    $("#error_image").empty(); 
    $.ajax(
    { 

     url: 'avatar', 
     processData: false, 
     contentType: false, 
     type: "post",//use for update 
     data: new FormData($("#updateprofileimage")[0]), 
     success: function(data) 
     { 
      if(data.status) 
      {   
       $("#uploadimagediv").html('<div class="alert alert-success"><button type="button" class="close">×</button>'+data.message+'</div>'); 
       window.setTimeout(function() 
       { 
        $(".alert").fadeTo(500, 0).slideUp(500, function() 
        { 
         $(this).remove(); 
        }); 
       }, 5000); 
       $('.alert .close').on("click", function(e) 
       { 
        $(this).parent().fadeTo(500, 0).slideUp(500); 
       }); 
       //console.log(data); 
       //$("#updateprofileimage")[0].reset(); 
       //window.location.href = "http://localhost/laravel/admin/profile"; 
      } 
      else 
      { 
       errors = data.errors; 

       for(error in errors) 
       { 
        $("#error_"+error.title).html(error.message); 
       } 
      } 
     }, 
     error: function(xhr) 
     { 
      if(xhr.status == 422) 
      { 
       errors = xhr.responseJSON; 
       for(error in errors) 
       { 
        $("#error_"+error).html(errors[error][0]); 
       } 
      } 
     } 
    }); 
});

错误是：“网络错误：500内部服务器错误 - http://localhost/laravel/admin/avatar”

请建议我在哪里出错。

控制器是

public function postAvatar(ImageUploadRequest $request) 
{ 
    --- 
}

答

Add the below line inside <head> 
<meta name="csrf-token" content="{{ csrf_token() }}"> 

And add the below lines before your ajax call in javascript function 
$.ajaxSetup({ 
     headers: { 
      'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') 
     } 
}); 

And don't forget to give permission to your storage folder 
sudo chmod -R 777 storage

我仍然得到错误“NetworkError：500内部服务器错误 - HTTP：//本地主机/ laravel /管理/阿凡达” –

感谢响应 –

看起来像你没有正确地把你的路线在ajax网址附近，$ .ajax（ { url：'avatar'，它必须是网址：'{{route（'name'）}}' –

答

在你的Ajax的设置，你必须提供X-CSRF令牌与请求。为了您的Ajax请求，也有一个与你的网址一个问题：

$(document).on('click', '#updatepicture', function($e) 
    { 
     $e.preventDefault(); 
     // send an ajax request 
     $("#error_image").empty(); 
     $.ajax(
     { 

      url: "{{url('avatar')}}", 
      processData: false, 
      contentType: false, 
      type: "post",//use for update 
      data: new FormData($("#updateprofileimage")[0]), 
      headers: { 
      'X-CSRF-TOKEN': "{{ csrf_token() }}" 
      }, 
      success: function(data) 
      { 
       if(data.status) 
       {   
        $("#uploadimagediv").html('<div class="alert alert-success"><button type="button" class="close">×</button>'+data.message+'</div>'); 
        window.setTimeout(function() 
        { 
         $(".alert").fadeTo(500, 0).slideUp(500, function() 
         { 
          $(this).remove(); 
         }); 
        }, 5000); 
        $('.alert .close').on("click", function(e) 
        { 
         $(this).parent().fadeTo(500, 0).slideUp(500); 
        }); 
        //console.log(data); 
        //$("#updateprofileimage")[0].reset(); 
        //window.location.href = "http://localhost/laravel/admin/profile"; 
       } 
       else 
       { 
        errors = data.errors; 

        for(error in errors) 
        { 
         $("#error_"+error.title).html(error.message); 
        } 
       } 
      }, 
      error: function(xhr) 
      { 
       if(xhr.status == 422) 
       { 
        errors = xhr.responseJSON; 
        for(error in errors) 
        { 
         $("#error_"+error).html(errors[error][0]); 
        } 
       } 
      } 
     }); 
    });

我仍然收到错误“NetworkError：500内部服务器错误 - http：// localhost/laravel/admin/avatar” –

感谢您的回复... –

@ashishbansal答复编辑 –

Laravel图像上传使用ajax 500内部服务器错误

相关推荐