【问题标题】:Save a `toDataURL` Image to Server将“toDataURL”图像保存到服务器
【发布时间】:2017-11-19 22:47:09
【问题描述】:

我试过实现signature_pad,但我真的不明白。

如何返回图像值并将其发布到我的服务器?

编辑:

我试过解码:

JavaScript“app.js”:

saveButton.addEventListener("click", function (event) {
    if (signaturePad.isEmpty()) {
        alert("Please provide signature first.");
    } else {
        saveSignature(signaturePad.toDataURL());
    }
});

function saveSignature(dataURL) {
$.ajax({
  type: "POST",
  url: "script.php",
  data: { 
     imgBase64: dataURL
  }
}).done(function(o) {
  console.log('saved'); 
});
}

PHP,“script.php”:

<?php
    // requires php5
    define('UPLOAD_DIR', 'images/');
    $img = $_POST['img'];
    $img = str_replace('data:image/png;base64,', '', $img);
    $img = str_replace(' ', '+', $img);
    $data = base64_decode($img);
    $file = UPLOAD_DIR . uniqid() . '.png';
    $success = file_put_contents($file, $data);
    print $success ? $file : 'Unable to save the file.';
?>

【问题讨论】:

    标签: javascript ajax post todataurl


    【解决方案1】:

    在 PHP 代码中,您必须得到 $_POST['imgBase64'] 而不是 $_POST['img']

    您的 PHP 代码不会返回 json 数据

    试试这个: echo json_encode(['result' =&gt; $success ? $file : 'Unable to save the file.'])

    【讨论】:

    • 谢谢。我做了更多的阅读并意识到这一点。您的解决方案会起作用,还是应该使用我在编辑的 OP 中尝试过的解决方案?我在编辑的 OP 中所做的尝试不起作用,但我认为它接近工作了。
    • $.ajax 中调用添加dataType: "json" 以确保数据类型并在PHP 代码中作为我的答案
    • Here's an image of my web directory。我尝试了你的修复,但我仍然没有得到任何回报。我也应该做一些其他的事情吗?
    • 我不知道如何启动控制台。我主要使用 Coda,一个只允许您编辑文件的应用程序。我尝试在 DreamWeaver 中打开整个站点,但也不知道如何获得控制台。对不起。
    • @yeeeeee in chrome 你可以Right-click 并单击Inspect 项目。然后选择Console 选项卡。(CTRL+SHIFT+I [在 Windows 中])
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-12-04
    • 2015-01-24
    • 2019-12-16
    • 1970-01-01
    • 2020-03-22
    相关资源
    最近更新 更多