通过表单

时间:2016-04-19 22:03:16

标签: javascript php jquery image resize-crop

我正在使用图片编辑工具供用户上传图片并进行调整:http://foliotek.github.io/Croppie/

我可以通过几个函数发送它来缩短base64字符串。然后我尝试将其插入隐藏字段并提交表单。

$('#submit-update-business').on('click', function(e){
    e.preventDefault();
    // console.log(vanilla.get());
    vanilla.result('canvas', 'viewport', 'png', 0).then(function(src){
        var processed = Base64.encode(JSON.stringify(src));
        $('#new_image').val(processed);
        $('#update-business').submit();
    });
});

我知道字符串很长,但我无法想出任何其他方法来做到这一点。我也看到了建议通过ajax提交表单的答案,但这似乎有同样的陷阱。这实际上设法在桌面浏览器上正常工作。这是移动的有问题。我可以将图像的尺寸限制在3000x3000以下,但遗憾的是手机似乎拍摄了更高质量的照片。

我正在使用的工具Croppie有一种获取数据点和缩放的方法,但不是方向。如果有办法保存这些数据,或使用base64数据,并重新渲染图像,并以某种方式使用该图像,以便图像实际通过,这将是伟大的。如果有一个我只能用于移动设备的解决方案,那也可以工作,因为它在桌面上运行得很好。

1 个答案:

答案 0 :(得分:1)

使用ajax帖子而不是提交,如果在移动浏览器中有长度限制,则不需要hidden_​​field。如果您在服务器端不需要Base64编码开销,也不需要它。

.post(
  "/ajaxpostURL.php",
  {
    new_image: processed, // or new_image: src,
    other_form_param_or_data: 'some_data'
  }
);