Сохранить имя файла в базе данных и загрузить файл на сервер

Question

У меня есть код, который я хочу изменить, он есть где-то в Интернете.Он делает именно то, что я хочу, то есть загрузить изображение, предварительный просмотр, обрезать и сохранить.Однако, когда дело доходит до сохранения, оно сохраняет само изображение в базе данных вместо сохранения имени файла в базе данных и файла на сервере.

Вот код

if(isset($_POST["image"]))
{
 include('database_connection.php');
 $data = $_POST["image"];
 $image_array_1 = explode(";", $data);
 $image_array_2 = explode(",", $image_array_1[1]);
 $data = base64_decode($image_array_2[1]);
 $imageName = time() . '.png';
 file_put_contents($imageName, $data);
 $image_file = addslashes(file_get_contents($imageName));
 $query = "INSERT INTO tbl_images(images) VALUES ('".$image_file."')";
 $statement = $connect->prepare($query);
 if($statement->execute())
 {
  echo 'Image save into database';
  unlink($imageName);
 }
}

<script>  
$(document).ready(function(){

 $image_crop = $('#image_demo').croppie({
    enableExif: true,
    viewport: {
      width:200,
      height:200,
      type:'square' //circle
    },
    boundary:{
      width:300,
      height:300
    }    
  });

  $('#insert_image').on('change', function(){
    var reader = new FileReader();
    reader.onload = function (event) {
      $image_crop.croppie('bind', {
        url: event.target.result
      }).then(function(){
        console.log('jQuery bind complete');
      });
    }
    reader.readAsDataURL(this.files[0]);
    $('#insertimageModal').modal('show');
  });

  $('.crop_image').click(function(event){
    $image_crop.croppie('result', {
      type: 'canvas',
      size: 'viewport'
    }).then(function(response){
      $.ajax({
        url:'insert.php',
        type:'POST',
        data:{"image":response},
        success:function(data){
          $('#insertimageModal').modal('hide');
          load_images();
          alert(data);
        }
      })
    });
  });

  load_images();

  function load_images()
  {
    $.ajax({
      url:"fetch_images.php",
      success:function(data)
      {
        $('#store_image').html(data);
      }
    })
  }

});  
</script>

<input type="file" name="insert_image" id="insert_image" accept="image/*" />

Мне бы очень хотелось сохранить имя изображения / файла в базу данных и загрузить файл в папку на сервере.Любая модификация, которая поможет мне достичь того, чего я хочу, высоко ценится.

Answer 1

То, как вы получаете изображение, неверно.Вы должны использовать $_FILES, чтобы получить данные изображения.Вы используете $_POST.