Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

cássio jaques

pegar imagem do canvas e salvar com php

Recommended Posts

Neste projeto eu quero pegar a assinatura com canvas de uma pessoa e salvá-la no computador na pasta ims.

Ele dá a mensagem de salvamento, mas não está salvando na pasta 'ims'. Alguém sabe porque não está funcionando ou conhece outra maneira de fazer isso?


arquivo html:


<!DOCTYPE html>


<html lang="en" xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta charset="utf-8" />

<title>ASSINATURA DO DESTINATÁRIO</title>

<script type='text/javascript' src='https://code.jquery....3.js'></script>

</head>


<script>

window.onload = function () {


var largura = 500;

var altura = 300;


var quadro = document.getElementById("myCanvas");

quadro.setAttribute("width", largura);

quadro.setAttribute("height", altura);


var ctx = quadro.getContext("2d");



var desenhando = false;


quadro.onmousedown = function (evt) {

ctx.moveTo(evt.clientX, evt.clientY);

desenhando = true;

}


quadro.onmouseup = function () {

desenhando = false;

}

quadro.onmousemove = function (evt)

{

if (desenhando){

ctx.lineTo(evt.clientX, evt.clientY);

ctx.stroke();

}

}


}

</script>


<!-- <script type="application/javascript" language=javascript">

window.onload = create;

function create() {

var canvas = document.getElementById("myCanvas);

var x = canvas.getContext("2d");

x.fillStyle="rgba(216,69,100,1)";

x.fillRect(36,10,100,100);

x.fillStyle="rgba(27,135,35,1)";

x.fillRect(100,80,100,100);

</script> -->


<script type="text/javascript">

function saveIt()

{

var myDrawing = document.getElementById("myCanvas");

var drawingString = myDrawing.toDataURL("image/png");

var postData = "canvasData="+drawingString;

var ajax = new XMLHttpRequest();

ajax.open("POST", 'saveImage.php', true);

ajax.setRequestHeader('Content-Type', 'canvas/upload');

ajax.onreadystatechange=function()

{

if(ajax.readyState == 4)

{alert("imagem salva");}

}

ajax.send(postData);

}

</script>



<body>

<div>

<canvas id="myCanvas" width="225" height="225"</canvas>

</div>

<div>

<button onClick="saveIt();">Salvar Imagem</button>

</div>

</body>

</html>


</html>


saveImage.php

<?php

if(isset($GLOBALS("HTTP_RAW_POST_DATA"]))

{


$rawImage=$GLOBALS['HTTP_RAW_POST_DATA'];

$removeHeaders=substr($rawImage, strpos($rawImage, ",")+1);

$decode=base64_decode($removeHeaders);

$fopen = fopen('ims/myImage.png', 'wb' );

fwrite ($fopen, $decode);

fclose ($fopen);

}

?>


Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.