javascript - SignaturePad 将签名保存到服务器

Question

我正在尝试将我的签名保存在服务器上，但它没有保存签名，但我在我的 js 控制台日志中获得了“data:image/png;base64,iVBORw ...”。请帮我在服务器上保存我的签名。

我的JS代码：

function uploadSignature(mimetype) {
  var dataurl = signaturePad.toDataURL(mimetype);
  var blobdata = dataURLtoBlob(dataurl);

  var fd = new FormData(document.getElementById("UploadForm"));
  fd.append("imageData", blobdata, "filename")

  /** will result in normal file upload with post name "signature" on target url **/
  $.ajax({
    url: "/signature_pad.php",
    type: 'POST',
    data: fd,
    processData: false,
    contentType: false,
    dataType: 'html',
    success: function (response) {
      alert("AJAX OK: uploadSignature() ok");
      console.log(response);
    },
    error: function (e) {
      alert("AJAX ERROR: uploadSignature() fehlgeschlagen");
      console.log(e);
    }
  });
}

我的 PHP 代码将签名保存在服务器中：

<?php
if (isset($_POST['imageData'])) {
$imgData = base64_decode($_POST['imageData']);
$image_name= $_POST['image_name'];

// Path where the image is going to be saved
$filePath = '../'.$image_name.'.png';

// Delete previously uploaded image
if (file_exists($filePath)) { unlink($filePath); }

// Write $imgData into the image file
$file = fopen($filePath, 'w');
fwrite($file, $imgData);
fclose($file);
} else {
echo "imgData doesn't exists";
}

我是 ajax 新手，我不明白如何通过 ajax 发送请求以将签名保存在服务器上。太感谢了

标签： javascriptphpjqueryajax