New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

canvas.toDataURL('image/jpeg') returns image/png on Android #33

Open
ghinda opened this Issue Nov 25, 2012 · 9 comments

Comments

Projects
None yet
8 participants
@ghinda

ghinda commented Nov 25, 2012

Summary:

The toDataURL() method of the canvas element allows specifying the format in which to return the data url. By default it returns image/png, but specifying image/jpeg should return a JPEG image.

On Android, it always returns a image/png data url, regardless of the type parameter.

On desktop, Chrome returns the proper data url with the image/jpeg type.

More details:
http://ghinda.net/jpeg-blob-ajax-android/

Platforms:

  • Android 4+

How to reproduce:

  1. Check the example on Android 4+

Reduced Example:

http://jsfiddle.net/ghinda/na86m/

Bug Tracker ticket(s):

Workarounds:

@revolunet

This comment has been minimized.

revolunet commented Jan 27, 2013

Works here on nexus 4 With Android 4.2.1

@ghinda

This comment has been minimized.

ghinda commented Jan 31, 2013

Have only tested on 4.0.4 and 4.1 (and on CyanogenMod 10, based on 4.1).

Can't test on 4.2, but since you mention it's working, I'm guessing it was fixed sometime between 4.1 and 4.2.1.

@patrickkettner

This comment has been minimized.

patrickkettner commented Jan 31, 2013

For what its worth, I don't think this is a 'bug' technically. They are following the spec

image/png is used when the format requested is not supported/understood. (http://www.w3.org/TR/2011/WD-html5-20110405/the-canvas-element.html#dom-canvas-todataurl)

defiantly worth knowing you can't make a jpeg though.

@ruanosaur

This comment has been minimized.

ruanosaur commented May 27, 2014

Android 4.2.2 with Phonegap Android app, still only supporting png and NOT jpeg.

Bump.

@emekamicrosoft

This comment has been minimized.

emekamicrosoft commented Jun 10, 2014

this works in firefox, oCanvas.toDataURL("image/jpeg")

@aruncnt

This comment has been minimized.

aruncnt commented Nov 28, 2014

How To post this image on server ? I mean upload .

@frontenddeveloping

This comment has been minimized.

frontenddeveloping commented Nov 30, 2014

UA must support by spec image/png mime-type only. Other types - as UA wants.
Also as @patrickkettner notes if mime-type is not support - UA will returnimage/png type.
+1 for not a bug.

@gwyy

This comment has been minimized.

gwyy commented Dec 2, 2014

我也是遇到了这个问题,是不是 Android 不支持 jpeg 所以就用默认的 png 来实现了 那么我在服务端还要判断下是否是png

@gwyy

This comment has been minimized.

gwyy commented Dec 2, 2014

我自己写了个代码解决了 if 判断下 如果不是jpeg 那么 引入第三方类 转换成 jpeg
try{
url=canvas.toDataURL("image/jpeg",1);
}catch(e){
toDataURLFailed=true; // android may generate png
}

if( (toDataURLFailed || url.slice(0,"data:image/jpeg".length) !== "data:image/jpeg") ){
try{
var encoder = new JPEGEncoder();
url= encoder.encode(ctx.getImageData(0,0,w,h), 100);
}
catch(e){ alert(1); }
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment