Send canvas images to js c#



  • We need to send a canvas picture to the counter-eller. Trying to change image Total base64 by canvas.toDataURL()but that's how it keeps returning null.
    View

    <div class="l-canvas">
        <canvas id="canvas" width=@ViewData["width"] height=@ViewData["height"]></canvas>
    </div>
    

    js

     function canvasToImage() {
    
    canvas.deactivateAll().renderAll();
    var canvas = document.getElementById('canvas');
    var image = canvas.toDataURL({  //В image всегда приходит null
        format: 'jpeg',
        quality: 1
    });
    
    
    $.ajax({
        type: 'POST',
        url: "../../Home/UploadImage/",
        data: '{ "imageData" : "' + image + '" }',
        contentType: 'application/json; charset=utf-8',
        dataType: 'json',
        success: function (data, status) {
            alert('success')
        }
    })
    

    }

    Method

    public ActionResult UploadImage(string image)
    {
    byte[] data = Convert.FromBase64String(image);
    Session["imageSession"] = data;
    return RedirectToAction("Apply");
    }



  • For starters, you've got a mistake in the operation of the counteraller, which is not correctly indicated by the entry parameter instead of imageData waiting. imageThere he is. Null You. Well, the object of the ajax was too figuring out,

    Processed shipment

    $.ajax({
       type: 'POST',
        url: "../../Home/UploadImage/",
        data: {imageData : image}
        }).success(function (data, status) {
           alert('success')
        }).error(function(err){
           console.log(err);
        });
    

    Action:

    // тут у вас была ошибка
    public ActionResult UploadImage(string imageData)
    {
        byte[] data = Convert.FromBase64String(imageData);
        Session["imageSession"] = data;
        return RedirectToAction("Apply");
    }
    



Suggested Topics

  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2