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。

将文件名保存到数据库并将文件上传到服务器

1 个答案: