如何使用带有php的cropit jquery插件裁剪和上传照片

所以我目前发现这个照片裁剪插件叫做cropit 。 演示在这里 。 所以我想要做的是抓取裁剪的照片并将照片的名称上传到mysql数据库并使用php将其保存到目录中。

到目前为止我有这个：

HTML：

 
 
 
 
 
 Resize image 
   Submit 
  

jQUERY：

  $('form').submit(function() { // Move cropped image data to hidden input var imageData = $('.image-editor').cropit('export'); $('.hidden-image-data').val(imageData); // Print HTTP request params var formValue = $(this).serialize(); $('#result-data').text(formValue); // Prevent the form from actually submitting return false; }); 

所有我需要帮助的是php设置代码，因为当我裁剪照片并选择提交时，jquery返回序列化代码，所有这些我通常不熟悉的代码出现。 以下是jquery返回的序列化代码的几个字符：

 image-data=data%3Aimage%2Fpng%3Bbase64%2CiVBORw0KGgoAAAANSUhE... 

Answer 1

1.保存base64编码的图像

2.获取base64编码图像的文件名

  $encoded = "data%3Aimage%2Fpng%3Bbase64%2CiVBORw0KGgoAAAANSUhE"; $decoded = urldecode($encoded); $exp = explode(';', $decoded); $exp = explode(':', $exp[0]); $image = array_pop($exp); echo ($image); 

Answer 2

我通过不解码编码数据得到了Hosch Nok的工作答案。 不打电话：

 $decoded = urldecode($encoded); 

但直接使用$encoded变量。