Dawood Abbas

Dawood Abbas

  • NA
  • 264
  • 99k

upload canvas to project's folder using javascript and mvc?

Oct 15 2019 2:25 AM
I would like to save the my canvas into my project's folder 'Upload', so trying to convert it into image and then sending it to code behind and saving. But its getting whole web page screenshot not just canvas.
 
This is my javascript code :
  1. html2canvas(document.body, {onrendered: function (canvas) {  
  2. var mergedImage = canvas.toDataURL("image/png");  
  3. mergedImage = mergedImage.replace('data:image/png;base64,''');  
  4. var param = { imageData: mergedImage };  
  5. $http({  
  6. method: 'POST',  
  7. url: '/Admin/MyController/UploadImage',  
  8. data: JSON.stringify(param),  
  9. dataType: 'JSON',  
  10. headers: { 'content-type''application/json' }  
  11. }).then(function (response) { alert('Your photos successfully uploaded!');  
  12. }); } });  
This is my c# code in mvc controller's file:
  1. [HttpPost]  
  2. public ContentResult UploadImage(string imageData)  
  3. {  
  4. try  
  5. {  
  6. string fileNameWithPath = Server.MapPath("~/Images/SomeFolder/custom_name.png");  
  7. if (!Directory.Exists(fileNameWithPath))  
  8. {  
  9. using (FileStream fs = new FileStream(fileNameWithPath, FileMode.Create))  
  10. {  
  11. using (BinaryWriter bw = new BinaryWriter(fs))  
  12. {  
  13. byte[] data = Convert.FromBase64String(imageData);  
  14. bw.Write(data);  
  15. bw.Close();  
  16. } } } }  
  17. catch (Exception ex) { } return Content("Uploaded"); }  
I just need to save canvas only into the my project's folder.