javascript - How to send big files using ajax? -
so i'm working on simple project users gets upload image server. before mention problem here how i'm doing it:
client:
var dataurl = sendingcanvas.todataurl("image/*"); var imagedatatosend = dataurl.replace(/^data:image\/(png|jpg);base64,/, ""); formdata = { 'image': imagedatatosend }; $.ajax({ url: '../receive', type: 'post', data: formdata, encode: false, success: function(result){ alert(result); } }); fyi: imagedatatosend size lower 5mb , contains file data selected.
basically happens users select image using <input type="file" tag i'm setting selected file drawn in canvas convert base64 , send server.
java server:
string datareceived = request.getreader().lines().collect(collectors.joining(system.lineseparator())); byte[] bimg = base64.decodebase64(datareceived.getbytes("utf-8")); fileoutputstream fos = new fileoutputstream("hi.jpg"); fos.write(bimg); fos.close(); i think might not need explain code above does. i'm facing serious performance problem mean takes huge time write data hi.jpg file, if try system.out.println(datareceived); takes seconds mouse click respond on server console.
i don't know why happening, need send image data multipart or what?
all replies appreciated , in advance:)
use xmlhttprequest , formdata append file. sent using multipart , chunked appropriately.
see: https://developer.mozilla.org/en-us/docs/web/api/formdata/using_formdata_objects
Comments
Post a Comment