Изображение остается прежним после обновления и загрузки новых изображений

Я загрузил изображение и обрезал его с помощью Croppie, изображение успешно обновляет базу данных и успешно входит в каталог.

но новый образ перезаписывает старый образ с тем же именем, это было сделано намеренно. но изображение, снова отображаемое php, остается старым изображением (изображение было перезаписано новым)

Изначально проблем не было, но когда я не открывал проект более 2 недель, возникла проблема, подобная вышеописанной.

HTML-тег

<div class = "col-sm-3">
    <h4>Profile Picture</h4>
    <hr>
     <form action = "" id = "form" method = "post">
       <label class = "cabinet center-block">
         <figure><img src = "" class = "gambar img-responsive img-thumbnail" id = "item-img-output" />
         <figcaption><i class = "fa fa-camera"></i></figcaption>
         </figure>
         <input type = "file" class = "item-img file center-block" name = "file_photo"/>
        </label>
      </form>
</div>

JS с CROPPIE

<script type = "text/javascript">
        // Start upload preview image
        $(".gambar").attr("src", "../profile/pictures/img/<?=$profile['profile']?>");
        var $uploadCrop,
        tempFilename,
        rawImg,
        imageId;
        function readFile(input) {
            if (input.files && input.files[0]) {
                var reader = new FileReader();
                reader.onload = function (e) {
                    $('.upload-demo').addClass('ready');
                    $('#cropImagePop').modal('show');
                    rawImg = e.target.result;
                }
                reader.readAsDataURL(input.files[0]);
            }
            else {
                swal("Desculpe, seu navegador não suporta o FileReader API.");
            }
        }

        $uploadCrop = $('#upload-demo').croppie({
            viewport: {
                width: 230,
                height: 230,
            },
            enforceBoundary: false,
            enableExif: true
        });
        $('#cropImagePop').on('shown.bs.modal', function(){
            // alert('Shown pop');
            $uploadCrop.croppie('bind', {
                url: rawImg
            }).then(function(){
                console.info('jQuery bind complete');
            });
        });

        $('.item-img').on('change', function () { imageId = $(this).data('id'); tempFilename = $(this).val();
            $('#cancelCropBtn').data('id', imageId); readFile(this); });
        $('#cropImageBtn').on('click', function (ev) {
            $uploadCrop.croppie('result', {
                type: 'base64',
                format: 'jpeg',
                size: {width: 270, height: 270}
            }).then(function (resp) {
                $('#item-img-output').attr('src', resp);
            //$('#cropImagePop').modal('hide');
                $.ajax({
                    url: "../lib/proses/upload.php",
                    type: "POST",
                    data: {"image":resp},
                    success: function (data) {
                        html = '<img src = "' + resp + '" />';
                        $("#upload-image-i").html(html);
                        $('#cropImagePop').modal('hide');
                        swal.fire(
                            'Berhasil !',
                            'Profile berhasil diubah',
                            'success'
                        )
                    }
                });
            $('#cropImagePop').modal('hide');
            });
        });
        // End upload preview image  

    </script>

Процесс загрузки

<?php 
    session_start();
    require "../koneksi.php";

    $username = $_SESSION['username'];

    $croped_image = $_POST['image'];
    list($type, $croped_image) = explode(';', $croped_image);
    list(, $croped_image)      = explode(',', $croped_image);
    $croped_image = base64_decode($croped_image);
    $image_name = $username.'.png';

    // insert name to database
    $sql = "UPDATE users SET profile = '$image_name' WHERE username = '$username'";
    $query = mysqli_query($conn, $sql);

    // upload cropped image to server 
    file_put_contents('../../profile/pictures/img/'.$image_name, $croped_image);
?>

I want the newly uploaded image to appear to replace the old image in the file that displays the image (ex. index file, etc.)