如何通过在控制器中使用 ajax 传递数据来使用 laravel 5.3 将图像存储在数据库中？

Question

我创建了一个表格，如下所示 html代码：

<form method="post" class="inline" id="upload_form" enctype="multipart/form-data">
        <input style="margin-top:0px;" type="file" name="data1"  id="file1" class="btn btn-block btn-primary"/>
        <input type="hidden" name="_token" value="{{ csrf_token() }}" id="token">
        <a href="#" id="submit">link submit</a>
</form>

ajax 代码：

function create()
{

         alert();
         var file = document.getElementById('file1');
         var token = document.getElementById('token').value;
         var data1 = new FormData($("#upload_form")[0]);
         var route = "http://localhost:8080/form";
         console.log(FormData);
         console.log(data1);



         $.ajax({
                    type:'POST',
                    url: route,
                    headers: {'X-CSRF-TOKEN': token},
                    contentType: false,
                    processData: false,
                    data:{
                                'data1': data1,
                         },
                    success:function(e){
                        if(e == 0)  
                        {
                             alert("Success Full Created"); 

                        }
                        else
                        {   
                             alert("Error");
                        }
                    }
                 });
         }

这是我的路线：

Route::post('form', 'StoreController@newstore');

我创建了下面给出的控制器 控制器：

public function newstore(Request $request)
{
   $post = $request->file('data1');
   dd($post);
   //If there is error try dd($post) and let me know 
   // we need know if the data file image is passing to controller
   $imageName =  $post->getClientOriginalName();
   $imagemove= $post->move(public_path('images'),$imageName);
   $data123 = array (   "photo"=> $imageName,  );
   $check222 = DB::table('product') -> insert($data123);    
}

当我运行此代码时，它会显示此错误： RouteCollection.php 第 218 行中的 MethodNotAllowedHttpException：

Answer 1

试试这个：

<form method="post" class="inline" id="upload_form" enctype="multipart/form-data">
<input style="margin-top:0px;" type="file" name="data1"  id="file1" class="btn btn-block btn-primary"/>
<input type="hidden" name="_token" value="{{ csrf_token() }}" id="token">
<a href="#" id="submit">link submit</a>
</form>

例如，如果您的路线是：

Route::post('form', 'yourcontroller@newstore');

JS

function create()
{

 var file = document.getElementById('file1');
 var route = "http://localhost:8000/form";
 var token = document.getElementById('token').value;
 var data1 = new FormData($("#upload_form")[0]);
 // we are using "$", i hope that you have jquery library 
/* alternative you can do:
   var getUpload = document.queryselector('#upload_form');
   var data1 = getUpload[0];
*/ 

//if there is error try also console.log(formData)
// if error try console-log(data1); info about the file uploaded
// if error token verify console.log(token); have the token serial number


$.ajax({
        type:'POST',
        url: route,
        headers: {'X-CSRF-TOKEN': token},
        contentType: false,
        processData: false,
        data:{
                    'data1': data1,
             },
        success:function(e){
            if(e == 0)  
            {
                 alert("Success Full Created"); 

            }
            else
            {   
                 alert("Error");
            }
        }
});}
var submit = document.querySelector('#submit').onclick= create

控制器

public function newstore(Request $request)
{
   $post = $request->file('data1');
   //If there is error try dd($post) and let me know 
   // we need know if the data file image is passing to controller
   $imageName =  $post->getClientOriginalName();
   $imagemove= $post->move(public_path('images'),$imageName);
   $data123 = array (   "photo"=> $imageName,  );
   $check222 = DB::table('product') -> insert($data123);   
}

如果您遇到错误，请告诉我！我希望它有效！