Cómo enviar una imagen base64 a través de ajax

Estoy desarrollando constructor de camisetas. Cuando envío datos de base64 (canvas.toDataUrl()) a través del método POST de ajax al servidor, obtengo una cadena base64 con espacios.

Por ejemplo:

Enviar:

data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAhsAAAIbCAYAAABCJ1y9AAAgAElEQVR4Xuy9CbCmVXkuur7pn/bcczd00w2INAhBmdQ4EDNpHEi8gVMQcyKpc3NOck3lOKRyokmFUzmHSupgLG9MTFKpeK

Obtener:

data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAhsAA 
 AIbCAYAAABCJ1y9AAAgAElEQVR4Xuy9CbCmVXkuur7pn/b 
 cczd00w2INAhBmdQ4EDNpHEi8gVMQcyKpc3 NOck3lOKRyokmFUzmH SupgLG9MT   FKpeK

Código JS:

var data = csrfParam + '=' + csrfToken + '&front_base64=' + frontImage
     + '&back_base64=' + backImage + '&product_id=' + currentProduct['id'] 
     + '&color_id=' + currentProductColorId + '&size_id=' + 
     currentProductSize;
 var xhr = new XMLHttpRequest();
 xhr.open('POST', '/constructor/add-to-cart/', true);
 xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
 xhr.send(data);
 xhr.onload = function () {console.log(xhr.responseText)}

captura de pantalla de espaciado blanco

Respuestas a la pregunta(2)

Su respuesta a la pregunta