samedi 28 février 2015

Edit image with pixlr

I am trying to edit an image with the web app pixlr. They provide a web application that can be called using the api:


http://ift.tt/1I23A1J


When I try the examples on their site, everything works fine. In their examples they just call the API by using the image url. In my example however, I would like to send the contents of an HTML5 canvas to the web app. This would be done by first getting the encoded data url from the canvas and then sending it to pixlr.



var imageData = imageElement.toDataUrl();


Now, with this approach we can not use the simple GET request to transmit it to pixlr, but we have to use the POST request to send it. This is described in their documentation:


in paramters:

Image : A URL to the image or the post raw data of the image to open


So I have this to send the image data to the web app:



$.ajax({
url: 'http://ift.tt/1po0dMk',
type: 'POST',
dataType: 'json',
headers : {
"content-type": "gzip"
},
data: {
image: imageData,
title:'screenshot',
service:'express'
}
}).error(function() {
alert('Could not reach pixlr app');
});


When I look at the console, this requests responds with a 200, but the web app does not open as expected. Does anybody know what I am doing wrong? Thanks.


Aucun commentaire:

Enregistrer un commentaire