Dropzonejs + Image Intervention Возвращаемое значение php - случайные HTML-коды

Question

Мой код загрузки работает хорошо, используя dropzonejs, и моя следующая задача - создать эскиз для загруженного изображения. И поэтому я использовал Image Intervention и смог создать миниатюру, единственная проблема, с которой я столкнулся, это когда я пытаюсь объединить две задачи в одном методе, dropzonejs возвращает кучу HTML-кодов. и хорошо, фактически каждый раз, когда я помещаю оператор return в метод UploadImage, он возвращает случайные HTML-коды. Я прочитал документацию dropzonejs и не знаю, откуда берутся коды. Любой совет приветствуется. заранее благодарю за любую помощь и предложения.

ниже мои коды.

Маршрут:

Route::post('uploadimage', 'ProductController@uploadImage');

контроллер:

public function uploadImage(Request $request){

       //create folder
        $products = new Products();

        $args['foldername'] = $request->input('folname');

        $products->createDirectory($args);

        $origName = $request->file('file')->getClientOriginalName();



        $request->file('file')->move(public_path().env('FOLDER_NAME_IMAGES').$args['foldername'].'/', $origName );

        $this->createThumbnail($request);

    }

public function createThumbnail($request){

    $origName = $request->file('file')->getClientOriginalName();
    $image = new Image();
    $file = $request->file('file');
    $objImage = $image->make($file->getRealPath());
    //create thumbnail
    $objImage->save(public_path().env('FOLDER_NAME_IMAGES').'fad611c8-56c7-4a7a-8af9-a2908267f08f'.'/'.$origName)
        ->resize(200,200)            // ->greyscale()
        ->save(public_path().env('FOLDER_NAME_IMAGES').'fad611c8-56c7-4a7a-8af9-a2908267f08f'.'/'.'thumb-'.$origName);

}

JS код:

var previewNode = document.querySelector("#template");
            previewNode.id = "";
            var previewTemplate = previewNode.parentNode.innerHTML;
            previewNode.parentNode.removeChild(previewNode);

        var myDropzone = new Dropzone(document.body,
        {
            url: "/uploadimage",
            thumbnailWidth: 80,
            thumbnailHeight: 80,
            parallelUploads: 10,
            previewTemplate: previewTemplate,
            clickable: ".fileinput-button",
            previewsContainer: "#previews",
            maxFiles: 10,
            maxFilesize: 200, //  MB
            acceptedFiles: "image/*"
        });

        myDropzone.on("sending", function(file,xhr,formData) {
            // Show the total progress bar when upload starts
            var folname = document.getElementById('folname').value;
            formData.append('folname',folname);
        });

        document.querySelector("#actions .cancel").onclick = function() {
            myDropzone.removeAllFiles(true);
        };

        myDropzone.on("removedfile", function(file,xhr,formData) {
            var file_name = file.name; //filename of image

            var folname = document.getElementById('folname').value;

            console.log(folname);
            console.log(file_name);

            $.ajax({
                type: 'POST',
                url: '/deleteimage',
                data: { 'filename': file_name,'folname': folname },
                success: function(report) {
                    console.log(report);
                },
                error: function(report) {
                    console.log(report);
                }
            });
        });

        myDropzone.on("addedfile", function(file) {
            // Hookup the start button
            //get elementbyid set value to previous + 1
            var val_pic_count = document.getElementById('pic_count').value;
            document.getElementById("pic_count").value = Number(val_pic_count) + 1;
        });

HTML код:

<div id="actions">
        <div class="btn btn-success fileinput-button">
            <span>Add pictures...</span>
        </div>
         <button type="reset" class="btn btn-warning cancel">
            <span>Remove all</span>
         </button>
    </div> <!--<div id="actions">-->


    <input type="hidden" name="pic_count" id="pic_count" value="0">
    <span dz-max-files-reached ></span>
    <br><br>
    <ul class="list-inline">
        <li>&nbsp;</li>
        <li id="previews">
                <div id="template">
                    <span class="preview"><img data-dz-thumbnail /></span>
                    <span class="name" data-dz-name></span>
                    <strong class="error text-danger" data-dz-errormessage></strong>
                    &nbsp;&nbsp;&nbsp;
                    <span class="pull-right">
                        <button data-dz-remove class="btn btn-danger delete">
                        <span>Delete</span>
                        </button>
                    </span>
                    <div style="height: 10px;"></div>
                </div>
        </li>
         <li>&nbsp;</li>
    </ul>

Результат:

Метод createThumbnail работает, когда я попробовал это отдельно.

Answer 1

Хорошо, обнаружил проблему. Это последовательность моих методов и, самое главное, переменная, которая передается объекту Intervention, неверна.

поэтому в основном проблема в том, что я пытался сохранить файл, который уже был перемещен. Метод createThumbnail должен идти первым перед сохранением или перемещением исходного файла.

правильный код ниже.

public function uploadImage(Request $request){

       //create folder
        $products = new Products();

        $args['foldername'] = $request->input('folname');

        $products->createDirectory($args);

        $origName = $request->file('file')->getClientOriginalName();

        $this->createThumbnail($request);    

        $request->file('file')->move(public_path().env('FOLDER_NAME_IMAGES').$args['foldername'].'/', $origName );



    }

а также я обнаружил, что в моем методе createThumbnail он не принимает значение метода getRealPath().

предыдущий код:

$objImage = $image->make($file->getRealPath());

правильный путь - просто передать переменную $file

правильный код:

$file = $request->file('file');
$objImage = $image->make($file);

а также для случайных HTML-кодов. это не случайно, я просто пропустил чтение нижней части кодов, это в основном html коды страницы ошибки laravel. задача решена.