javascript - Image upload, resizing and encoding to base64 crashes Chrome on mobile -


My users can select an image using the file-upload HTML input element -

1. From there I downscale

2 I convert to base 64

Chrome Mobile & amp; The Android browser displays a crash - and 'out of memory error'.

If the browser runs on a more 'modern / enabled' device then it is perfectly fine.

Here is the reason for the error - can this be corrected?


Here is an action that gives down aspect ratio (keeping aspect ratio) and image base 64 string Resize the function and convert 64 (IMG, MaxWide, MaxHit) {var imgWidth = img.width, imgHeight = img.height; Var ratio = 1, ratio 1 = 1, ratio 2 = 1; Ratio 1 = MaxWide / IMG depth; Ratio 2 = max heitt / imgwr; // Use the smallest proportion that the image is the best fit in the MaxWith X MaxHoight box. If (ratio 1lt; ratio 2) {ratio = ratio 1; } And {ratio = ratio 2; } Var Canvas = document.createElement ("canvas"); Var Canvas Contact = Canvas. GateConttex ("2D"); Var canvas coppie = document.createElement ("canvas"); Var copyContext = canvasCopy.getContext ("2d"); Var Canvas Cop 2 = Document. Create Element ("Canvas"); Var copyContext2 = canvasCopy2.getContext ("2D"); Canvas Coop. Wide = IMG live; Canvas Coop. Heights = imgite; CopyContext.drawImage (IMG, 0, 0); // init canvasCopy2.width = imgWidth; Canvas coop 2 Heights = imgite; CopyContext2.drawImage (Canvas Cop, 0, 0, Canvas Cop, Wide, Canvas Cop. High, 0, 0, Canvas Cop 2. Wide, Canvas Cop 2. High); Var round = 1; Var roundRatio = ratio * round; For (var i = 1; i & lt; = round; i ++) {// TMP canvas cop.width = imgwdath * roundtatio / i; Canvas cop.height = imgheight * roundabouto / eye; CopyContext.drawImage (Canvas Cop 2, 0, 0, Canvas Cop 2. Wide, Canvas Cop 2. High, 0, 0, Canvas Cop, Wide, Canvas Cop. // Copy Back to Canvas Coop 2 Wide = IMGWDath * RoundRatio / I; Canvas coop 2 HEIGHT = IMGHT * RoundRatio / Eye; CopyContext2.drawImage (Canvas Cop, 0, 0, Canvas Cop, Wide, Canvas Cop. High, 0, 0, Canvas Cop 2. Wide, Canvas Cop 2. High); } // // return base 64 string downscaled image canvas.width = imgudoodthat rounderatio / round; Canvas HEIGHT = IMGHT * RoundRatio / Round; CanvasContext.drawImage (canvas cop 2, 0, 0, canvas coop 2. wide, canvas coop 2.high, 0, 0, canvas.Wide, canvas.height); Var dataURL = canvas.toDataURL (); Return data URL; } I think this is an error of Chrome Mobile.
Chrome Mobile is not stable and whenever I use it, crashes in my hands often happens.
A memory message states that your device has not received enough memory for this script.
Whether it works with Dolphin Browser
I think this will work but I do not know it.

Comments

Popular posts from this blog

php - PDO bindParam() fatal error -

logging - How can I log both the Request.InputStream and Response.OutputStream traffic in my ASP.NET MVC3 Application for specific Actions? -

java - Why my included JSP file won't get processed correctly? -