0

Somehow I am capturing a canvas image through camera and send it's canvas.toDataURL() to server so the server can save it as a png file, Now before I mention the problem here is my code:

var dataURL = canvas.toDataURL("image/png");
    formdata = dataURL.replace(/^data:image\/(png|jpg);base64,/, "");
    alert(formdata);
    $.ajax({
        url: '../canvasdopost',
        type: 'POST',
        data: formdata,
        processData: false,
        contentType: false,
        success: function(data){

        }
    });

Server:

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
     Part part = request.getPart("canvasdata");
      BufferedReader br = new BufferedReader(new InputStreamReader(part.getInputStream(),
          Charset.forName("utf-8")));
      String sImg = br.readLine();
      System.out.print(sImg);
}

Server console output:

java.lang.IllegalStateException: Unable to process parts as no multi-part configuration has been provided at org.apache.catalina.connector.Request.parseParts(Request.java:2733)

I also tried:

String test = request.getReader().lines().collect(Collectors.joining(System.lineSeparator()));
System.out.print(test);

now the problem is that I never get my server console to output what I get in my client alert box before sending the data.

And thanks for those too who tell me how to save the received base64 data to an actual image file

darees
  • 17
  • 2
  • 8

1 Answers1

0

Just for those who are facing same problem,

simple as this:

Server:

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    String test = request.getReader().lines().collect(Collectors.joining(System.lineSeparator()));
    System.out.print(test);
    byte[] bImg64 = test.getBytes();
    byte[] bImg = Base64.decodeBase64(bImg64); // apache-commons-codec
    FileOutputStream fos = new FileOutputStream("D:\\img.png");
    fos.write(bImg);
    fos.close();
}

client:

var dataURL = canvas.toDataURL("image/png");
formdata = dataURL.replace(/^data:image\/(png|jpg);base64,/, "");
$.ajax({
    url: '../signupcanvasdopost',
    type: 'POST',
    data: formdata,
    processData: false,
    contentType: "text/html",
    success: function(data){

    }
});
darees
  • 17
  • 2
  • 8