Как отправлять canvas в базу данных?

Question

[ivanmats]

Здравствуйте.
Есть такой код:

<div class="block-field signature">
    <span>Your signature:</span>
    <canvas id="signature-pad"></canvas>
    <div id="signature-field-clear" class="clear">Clear</div>
    <input type="hidden" id="signature-data" name="signature-data">
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/signature_pad/1.3.5/signature_pad.min.js" referrerpolicy="no-referrer"></script>

Так-же JS код:

var canvas = document.getElementById("signature-pad");

function resizeCanvas() {
    var ratio = Math.max(window.devicePixelRatio || 1, 1);
    canvas.width = canvas.offsetWidth * ratio;
    canvas.height = canvas.offsetHeight * ratio;
    canvas.getContext("2d").scale(ratio, ratio);
}
window.onresize = resizeCanvas;
resizeCanvas();

var signaturePad = new SignaturePad(canvas);
        
$('#signature-field-clear').on('click', function() {
    signaturePad.clear();
    return false
});

Суть идеи такая - в канвасе человек делает свою роспись (это работает с данным кодом), но ловлю затуп дальше. Как сделать отправку в базу данных mysql?

Answer 1

[Stalker_RED]

canvas.toDataURL('image/png')https://developer.mozilla.org/en-US/docs/Web/API/H...

И потом отправка блоба через FormData
https://developer.mozilla.org/en-US/docs/Web/API/F...