问题如何使用laravel中的ajax post请求将图像插入到db中？

Laravel观点：

<form  enctype="multipart/form-data" method="post" name="imagesform" id="imagesform" >
    <input type="hidden" name="_token" value="{{ csrf_token()}}">
    <div>
        <label id="show" for="files" class="button">Upload photo</label>
        <input id="files" name="images" style="visibility:hidden;" type="file">
    </div> 
    <button type="submit"  class="save" id="saveImage" style="border-radius: 8px; padding: 5px 15px;">SAVE</button>
</form>

这是我上传图像的代码（它发生在我的引导程序模型中）。当我上传图像并单击提交按钮时，图像应该插入到数据库中，并且应该检索并显示在视图页面上。

Ajax代码：

$("#saveImage").click(function(e){
    // var formdata=new FormData($("#imagesform")[0]);
    //alert(formdata);
    $.ajaxSetup({
        headers: { 'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content') }
    });
    $.ajax({
        url: 'saveImages/{{$dataId}}',
        type: 'POST',
        data:new FormData($("#imagesform")),
        success: function (data) {
            alert(data)
        },
        cache: false,
        processData: false
    });
    return false;
});

这是ajax代码，我试过了。但是formdata的警告显示了 [对象FormData] 和浏览器控制台显示 Method not allowed exception

Laravel路线：

Route::post('saveImages/{dataId}',['as' => 'saveImages','uses'=>'priceDetails@saveImages']);

控制器：

public function saveImages(Request $imagesform,$dataId)
{
    if (Input::hasFile('images'))
    {
        $name  = $this->getImageId().".".$imagesform->file('images')->getClientOriginalExtension();   

        $image = $imagesform->file('images');        
        $resize = Image::make($image)->resize(700, 300)->encode($imagesform->file('images')->getClientOriginalExtension());
        $hash = md5($resize->__toString());

        $path = "public/" . $name;
        Storage::put($path, $resize->__toString());
    }
    $insertImages=new photosModel;
    $insertImages->imagesid=$this->getimagesId();
    $insertImages->deviceCategoryId=$dataId;
    $insertImages->uploadedImages=$name;
    $insertImages->save();
    return $this->formImages($dataId);

}

public function formImages($dataId){
    $dataId=$dataId;
    $images=photosModel::all();
    return view('addProductDetails1')->with('images',$images)->with('dataId',$dataId);
}

13022

2017-08-30 05:46

起源

var form = $('#imagesform')[0];var formData = new FormData(form); 试试这个 - Mayank Vadiya

发生同样的错误 - suryakala velusamy

再次提醒[对象FormData] - suryakala velusamy

尝试使用cosole.log而不是alert（）并将其放入ajax缓存中：false，contentType：false，processData：false， - Mayank Vadiya

它以可扩展的形式出现 - suryakala velusamy

答案:

要通过AJAX上传文件，您需要使用 XHR 2级。该 FormData 上课需要一个 HTMLFormElement 在构造函数中，如果要发送其键值。

你应该使用：

new FormData( document.getElementById('imagesform') );

你也可以使用jQuery：

new FormData( $("#imagesform").get(0) )

检查我的答案在另一个类似的问题，以获得更多信息。

更新： 看到你的评论你的问题也在于Laravel路线。如果错误代码为500并且显示消息“Method not allowed”，则需要检查您的路线 路线/ web.php。请在此处输入错误的堆栈跟踪和路由文件（使用pastebin或类似文件）。

2017-08-30 08:53

priceDetails是我的控制器名称Sir - suryakala velusamy

路线文件中的行？ - suryakala velusamy

我道歉，我没有看到你的问题。请问你能把这个错误与stacktrace放在一起吗？ - Pedro Gámez

Route :: post（'saveImages / {dataId}'，['as'=>'saveImages'，'uses'=>'priceDetails @ saveImages']）; - suryakala velusamy

这是我的路线代码 - suryakala velusamy

我能够通过Frankensteining来解决类似的问题这里。那个链接有很多非常好的信息。您需要将ajax调用中的一些选项指定为false。无论如何，这对我有用：

HTML

<input name="image" type="file" id="image">

使用Javascript

data = new FormData();
    jQuery.each(jQuery('#image')[0].files, function(i, file) {
        data.append('image', file);
    });

$.ajax({
    url: "submit/ajax",
    type: 'POST',
    cache: false,
    contentType: false,
    processData: false,
    data: data,
    success: function(response)
       {
          // Display your uploaded image on the page
       }
    });

PHP

Image::make($_FILES['image']['tmp_name']) >save("$myImageDirectory/$newImagegName");

2017-09-10 07:58

问题 如何使用laravel中的ajax post请求将图像插入到db中？

答案:

热门问题

问题如何使用laravel中的ajax post请求将图像插入到db中？