save image with ajax in ruby on rails

Question

I dont know how to save an image in AJAX with Ruby on rails, this is my repo in github, github.com/luis77/EdiTor22 please chek it out, I have been trying this for 2 days, but I dont know what is wrong. For example, check the view attachment/new here is the code in javascript with the ajax code:

 <script>
    var canvas = document.createElement('canvas');
    var context = canvas.getContext('2d');
    var centerX = canvas.width / 2;
    var centerY = canvas.height / 2;
    var radius = 70;

    context.beginPath();
    context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
    context.fillStyle = 'green';
    context.fill();
    context.lineWidth = 5;
    context.strokeStyle = '#003300';
    context.stroke();

    document.body.appendChild(canvas)


    var dataURL =  canvas.toDataURL('image/png');




   // Convert dataURL to Blob object
      function dataURLtoBlob(dataURL) {
    // Decode the dataURL    
    var binary = atob(dataURL.split(',')[1]);
    // Create 8-bit unsigned array
    var array = [];
    for(var i = 0; i < binary.length; i++) {
        array.push(binary.charCodeAt(i));
       }
    // Return our Blob object
    return new Blob([new Uint8Array(array)], {type: 'image/png'});
      }




       // Get our file
      var file= dataURLtoBlob(dataURL);
      // Create new form data
      var fd = new FormData();
     // Append our Canvas image file to the form data
      fd.append("image", file);
      // And send it
      $.ajax({
         url: "/attachments/change2",
         type: "POST",
         data: fd,
         processData: false,
         contentType: false,
      });




    </script>

it's specified in the routes:

  post "attachments/change2"

and the method in the controller,

but won't save, I need help with this code, please help.

score 0 · Answer 1 · answered Feb 06 '16 at 00:36

0

Assuming that your JavaScript code is correct, and the post data is making it to the server correctly, I would probably use something like CarrierWave or PaperClip to handle your file uploads.

answered Feb 06 '16 at 00:36

SirUncleCid

187
1
7

I am Trying to save an image created by canvas, with camanjs, not uploaded by me. ¿Can I save that image with paperclip? – Alexander Marcano Feb 06 '16 at 00:48
http://stackoverflow.com/questions/19032406/convert-html5-canvas-into-file-to-be-uploaded This will help you out with that! – SirUncleCid Feb 07 '16 at 01:52
Then yeah, paperclip or cw will do the rails end of the business. – SirUncleCid Feb 07 '16 at 02:00
I am using carrierwave, but i don't know how to save that image base64 through ajax. please i need your help :S – Alexander Marcano Feb 07 '16 at 23:14
i have been trying but nothing – Alexander Marcano Feb 07 '16 at 23:15
yes, in the javascript console "unpocessable entity" :S – Alexander Marcano Feb 09 '16 at 20:42
And what does your rails console say? – SirUncleCid Feb 10 '16 at 16:21

save image with ajax in ruby on rails

1 Answers1