4

Hello I have done project in that i can save image like downloading in to div then right click on that it displays save as image,I don't want to do like that. I want download image directly not like the above at the same time i want to save image path in database using SQL server and mvc3 web application.How to save in database I need to use any server side code. I Google it but couldn't find any relevant answer. Is it possible what i asked if so can any one guide me. Thanks in advance.

below code is for saving image and i need to change it. 

function downloadCanvas() {
    var canvas = stage.children[0].canvas;
    var oImgPNG = Canvas2Image.saveAsPNG(canvas, true);
    document.body.appendChild(oImgPNG);
  }

When I search in Google every one is using php code. how to use php code in html5.

Cathy
  • 377
  • 1
  • 4
  • 21

2 Answers2

1

Via Ajax send data to server and then save as image, 

var canvasData = canvas.toDataURL("image/png");
var ajax = new XMLHttpRequest();
ajax.open("POST",'save.php',false);
ajax.setRequestHeader('Content-Type', 'application/upload');
ajax.send(canvasData);

PHP,

<?php 
if (isset($GLOBALS["HTTP_RAW_POST_DATA"]))
{
    // Get the data
    $imageData=$GLOBALS['HTTP_RAW_POST_DATA'];


    $filteredData=substr($imageData, strpos($imageData, ",")+1);

    $unencodedData=base64_decode($filteredData);

    $random_digit=md5(uniqid(mt_rand(), true));

    $fp = fopen( 'yourfolder/new'.$random_digit.'.png', 'wb' );
    fwrite( $fp, $unencodedData);
    fclose( $fp );
    //Now save the path in database!
}
?>

The image will be saved at "yourfolder/new'.$random_digit.'.png'". Link to same question,

Sending photo from javascript to server

Community
  • 1
  • 1
MJQ
  • 1,778
  • 6
  • 34
  • 60
  • You can save the image path in database after creating the image in save.php. – MJQ Feb 22 '13 at 07:58
  • MJQ thanq for ur reply where should I kept this php code.I really don't knw about php where it be used. Can I write after html end tag – Cathy Feb 22 '13 at 09:20
  • @Geethika PHP is server side code, so you need a PHP server to run this code – jazzytomato Feb 23 '13 at 20:37
0

You have to send the image data to the server with an ajax call to the web server, like the following :

http://www.dotnetfunda.com/articles/article1662-saving-html-5-canvas-as-image-on-the-server-using-aspnet.aspx

Then, depending on the image size, store the URL of the image into SQL Server (if small image) OR store the data. Read this to help you make your choice : Save image url or save image file in sql database?

Community
  • 1
  • 1
jazzytomato
  • 6,994
  • 2
  • 31
  • 44
  • i have read that article but I am not using .aspx anywhere,I am using mvc3 controller with database workflow.Coming image size in my project i am saving multiple images as one image. – Cathy Feb 20 '13 at 09:19
  • I am new to database so could you elaborate little more so that I can learn more about it thanks for reply – Cathy Feb 20 '13 at 09:21