Dropzone:无法处理的实体Laravel 5

时间:2019-05-28 21:06:10

标签: laravel dropzone

我有以下代码。可以将titletagdescription的formData发送到控制器进行上传。但是我一直收到这个错误。

错误:

  

无法加载资源:服务器响应状态为422(无法处理的实体)

这是我的代码:

<!DOCTYPE html>
<html>
<head>
    <title>Laravel Multiple Images Upload Using Dropzone</title>
    <meta name="_token" content="{{csrf_token()}}" />
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.4.0/min/dropzone.min.css">
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.4.0/dropzone.js"></script>
    <style>
        .data{
            display:none;
        }

        .dropzone {
          width: 98%;
          margin: 1%;
          border: 2px dashed #3498db !important;
          border-radius: 5px;
          transition: 0.2s;
        }

        .dropzone.dz-drag-hover {
          border: 2px solid #3498db !important;
        }

        .dz-message.needsclick img {
          width: 50px;
          display: block;
          margin: auto;
          opacity: 0.6;
          margin-bottom: 15px;
        }

        span.plus {
          display: none;
        }

        .dropzone.dz-started .dz-message {
          display: inline-block !important;
          width: 120px;
          float: right;
          border: 1px solid rgba(238, 238, 238, 0.36);
          border-radius: 30px;
          height: 120px;
          margin: 16px;
          transition: 0.2s;
        }
        .dropzone.dz-started .dz-message span.text {
          display: none;
        }
        .dropzone.dz-started .dz-message span.plus {
          display: block;
          font-size: 70px;
          color: #AAA;
          line-height: 110px;
        }
    </style>
</head>
<body>
    <div class="container"> 
        <form method="GET"  enctype="multipart/form-data" class="dropzone" id="dropzone">
            <button id='upload'>Upload</button>
            @csrf
        </form>
        <div class='data' ></div> 
    </div>
    <script type="text/javascript">
        var title = $('#title').val();
        var description = $('#description').val();
        max=2
        var thumbnail;
        Dropzone.options.dropzone = {
            maxFiles: max,
            autoProcessQueue: false,
            uploadMultiple: true,
            method:"get",
            maxFilesize: 12,
            url: '/upload',
            init: function() {

                var myDropzone = this;
                $("#upload").click(function(e) {

                    // First change the button to actually tell Dropzone to process the queue.

                    // Make sure that the form isn't actually being sent.
                    e.preventDefault();
                    e.stopPropagation();
                    myDropzone.processQueue();
                });

                this.on("maxfilesexceeded", function(file) {
                    alert('Max of '+ max + ' files');
                    this.removeFile(file);
                });

                this.on("addedfile", function() {
                    this.on('thumbnail', function(file, thumbnail) {
                    thumbnail = file.thumbnail;
                });

                this.on('sending', function (file, xhr, formData) {
                    // Append all form inputs to the formData Dropzone will POST
                    var data = $('.dropzone').serializeArray();
                    $.each(data, function (key, el) {
                        formData.append(el.title, el.description, el.tags);
                    });
                    console.log(formData);
                });


                var myvar = '<div class="form-group">'+
                    '<img class="media-object thumbnail" src="'+ thumbnail +'" />'+
                    '<label for="title">Title</label>'+
                    '<input type="text" class="form-control" id="title" aria-describedby="title" placeholder="Give your image a title"><br>'+
                    '<label for="Description">Description</label>'+
                    '<input type="text" class="form-control" id="description" aria-describedby="Description" placeholder="Describe your image"><br>'+
                    '<label for="Tags">Tags</label>'+
                    '<input type="text" class="form-control" id="Tags" aria-describedby="Tags" placeholder="Give your image tags"><br>'+
                    '<small>Tags are important to let people easily find your image</small><br><br>'+
                    ''
                ;
                $('.data').show();
                $('.data').append(myvar);

            });
        },
        acceptedFiles: ".jpeg,.jpg,.png,.gif",
        addRemoveLinks: true,
        timeout: 50000,
        processQueue: function(file) {
            var name = file.upload.filename;
            $.ajax({
                headers:
                {
                    'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
                },
                type: 'POSTg',
                url: '{{ url("image/delete") }}',
                data: {
                    title: title,
                    description:description,
                    type:"image",
                    body:"upploaded/img"+filename
                },
                success: function(data) {

                    console.log("File has been successfully removed!!");
                },
                error: function(e) {
                    console.log(e);
                }
            });
            var fileRef;
            return (fileRef = file.previewElement) != null ?
                fileRef.parentNode.removeChild(file.previewElement) : void 0;
        },
        success: function(file, response) {
            console.log(response);
        },
        error: function(file, response) {
            return false;
        }
    };
</script>
</body>
</html>

这是 MyController

public function upload(StorePostRequest $request)
{

    $title= Post::where('title', $request->input('title'))->first();
    if (!$title == null) {
        return redirect()->back()->withErrors(['Title Already Exists', 'Title already exists']);

        return response()->json(["message" => "Failed","reason" => "Title Already Exists"]);
    }


    $post = Post::create([
        'title' => $request->input('title'),
        'body' => $request->input('body'),
        'description' => $request->input('description'),
        'type' => $request->input('type'),
        'user_id' => auth()->id(),
        'published_at' => $request->has('draft') ? null : \Carbon\Carbon::now()
    ]);
}

StorePostRequest.php

<?php

namespace App\Http\Requests;

use Illuminate\Foundation\Http\FormRequest;
use Illuminate\Support\Facades\Auth;

class StorePostRequest extends FormRequest
{
    /**
     * Determine if the user is authorized to make this request.
     *
     * @return bool
     */
    public function authorize()
    {
        return Auth::check();
    }

    /**
     * Get the validation rules that apply to the request.
     *
     * @return array
     */
    public function rules()
    {
        return [
            'title' => 'required|max:255',
            'body' => 'required',
            'tags' => 'nullable',
            'image' => 'nullable|image|max:2048'
        ];
    }
}

非常感谢。

0 个答案:

没有答案