So senden Sie Canvas-Bild an Datenbank auf Formular senden in Rails

Question

Ich erstelle eine Anwendung in Rails, wo Benutzer in der Lage sind, auf einem HTML5-Canvas mit JavaScript zu zeichnen. Mit JavaScript, habe ich in der Lage, die Leinwand zu einem Bild zu konvertieren, so kann der Benutzer leicht rechts, um die Leinwand klicken und speichern Sie das Bild:

var img = new Image; 
    img.onload = function(){ 
    ctx.drawImage(img,0,0); 
    }; 
    img.src = window.mapImgUrl; 

jedoch das Problem, dass die Leinwand in einem Formular lebt. Ich möchte, dass das Bildergebnis irgendwie zur Datenbank hinzugefügt wird, damit ich frühere Zeichnungen in anderen Ansichten der App anzeigen kann. Ich habe CarrierWave und AWS für Bild-Uploads eingerichtet, aber ich habe keine Möglichkeit, die Einstellungen neu zu konfigurieren, um die Canvas-Bilder beim Senden des Formulars als Uploads zu behandeln. Ist das etwas, das AJAX oder base64 beinhalten muss? Oder gibt es eine Möglichkeit, CarrierWave dafür zu nutzen?

Answer 1

Alles, was Sie zu tun haben, ist das Bild als base64 an den Server zu senden, dann die base64 Quelle wiederverwenden, wenn nötig.

Andernfalls funktioniert es möglicherweise nicht, da die Bildformatbytes interpretiert werden und durch andere Zeichen ersetzt werden können. Deshalb ist Base-64 am besten.