Не могу получить данные через $_FILES

Используя скрипт кадрирования изображения cropper.js пытаюсь отправить его на сервер через ajax, видимо где-то в запросе ошибка, так как данные не появляются в глобальной переменной $_FILES. Подскажите где может быть ошибка.

Код html

<link href="https://unpkg.com/cropperjs/dist/cropper.css" rel="stylesheet"/>
<script src="https://unpkg.com/cropperjs"></script>
<div class="col user-page">
    <div class="image_area" align="center">
        <label for="upload_image">
            <img src="images/noavatar.png" id="uploaded_image" class="img-responsive img-circle" />
            <div class="overlay">
                <div class="text">Нажмите, чтобы изменить изображение профиля</div>
            </div>
            <input type="file" name="image" class="image" id="upload_image" style="display:none" />
        </label>
    </div>
    <div class="modal fade" id="modal" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true">
        <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">Обрезать изображение перед загрузкой</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">×</span>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="img-container">
                        <div class="row">
                            <div class="col-md-8">
                                <img src="" id="sample_image" />
                            </div>
                            <div class="col-md-4">
                                <div class="preview"></div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" id="crop" class="btn btn-primary">Готово</button>
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Отмена</button>
               </div>
           </div>
       </div>
   </div>          

Код ajax

$(document).ready(function(){
    var $modal = $('#modal');
    var image = document.getElementById('sample_image');
    var cropper;

    $('#upload_image').change(function(event){
        var files = event.target.files;

        var done = function(url){
            image.src = url;
            $modal.modal('show');
        };

        if(files && files.length > 0)
        {
            reader = new FileReader();
            reader.onload = function(event)
            {
                done(reader.result);
            };
            reader.readAsDataURL(files[0]);
        }
    });

    $modal.on('shown.bs.modal', function() {
        cropper = new Cropper(image, {
            aspectRatio: 3/4,
            viewMode: 3,
            preview:'.preview'
        });
    }).on('hidden.bs.modal', function(){
        cropper.destroy();
        cropper = null;
    });

    $('#crop').click(function(){
        canvas = cropper.getCroppedCanvas({
            width:200,
            height:200
        });

        canvas.toBlob(function(blob){
            url = URL.createObjectURL(blob);
            var reader = new FileReader();
            reader.readAsDataURL(blob);
            reader.onloadend = function(){
            var base64data = reader.result;
                $.ajax({
                    url:'avatar.php',
                    method:'POST',
                    data: {image:base64data},
                    success:function(data)
                    {
                        $modal.modal('hide');
                        $('#uploaded_image').attr('src', data);
                    }
                });
            };
        });
    });
});

код php

if(isset($_POST['image'])) {

    $data = $_POST['image'];

    $image_array_1 = explode(";", $data);

    $image_array_2 = explode(",", $image_array_1[1]);

    $data = base64_decode($image_array_2[1]);

    $image_name = 'upload/' . time() . '.png';

    file_put_contents($image_name, $data);

    echo $image_name;
}

Ответы (0 шт):