toDataURL

HTMLCanvasElement インターフェイス toDataURL メソッド

[1] HTMLCanvasElement インターフェイスtoDataURL メソッドは、 data: URL による表現を返します。

画像形式

[16] 引数によって画像形式を指定できます。

[17] 省略された場合の既定値PNG (image/png) です。 PNG 出力は、必ず実装しなければならないことになっています。

[18] JPEG JFIF (image/jpeg) を指定することもできます。実装は必須とはなっていませんが、 多くの Webブラウザーは対応しています。

[19] 写真を扱う WebアプリケーションJPEG と指定していることがあります。最悪 PNG でも良いのかもしれませんが、 JPEG の方がファイルサイズその他の都合は良さそうです。

[20] JPEG にすると透過色不透明になります。

濫用

[26] 悪質な人には何の対策にもならず、一般利用者には不便になるだけの「対策」。技術者倫理はどうなっているのか。

歴史

[3] 元々 Hixiesrc IDL属性data: URL を返す形で Web Applications 1.0 に規定しましたが、 Bugzilla での議論を踏まえて toDataURL メソッドとなりました。 (当初の Hixie の案では HTMLCanvasElementHTMLImageElement継承していました。今はしていません。)

[2] Bug 291218 – Canvas .toDataURL() method (was: src attribute) ( ( 版)) https://bugzilla.mozilla.org/show_bug.cgi?id=291218

[4] この議論を経て Gecko に実装されたのが2005年4月以降のことでした。

[5] ちょうど2005年3月に <input type=uri><input type=url> に改名されています。それと関係あるのか無いのか、 >>2 では URI にしようという案は出ていません。

[7] Web Applications 1.0 仕様にはじめて入ったのは2005年4月21日版です。

[6] AndroidWebブラウザーはなぜか常に data:, を返します。 iPhoneMobile Safari では問題ないので、 WebKit の不具合ではなさそうです。

[8] >>6Android 版のブラウザが古い WebKit から派生しているためらしいです。

[9] ニンテンドー3DSインターネットブラウザーでも正しく動作しない模様です。

[10] HTMLCanvasElement.toDataURL() - Web API Interfaces | MDN ( 版) https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/toDataURL

Chrome also supports the image/webp type.

[11] Issue 170565 - chromium - [Canvas] toDataURL does not export WEBP with alpha channel - An open-source project to help move the web forward. - Google Project Hosting ( 版) https://code.google.com/p/chromium/issues/detail?id=170565

[12] Safari 4.0 ( 版) https://developer.apple.com/library/safari/releasenotes/General/WhatsNewInSafari/Articles/Safari_4_0.html#//apple_ref/doc/uid/TP40014305-CH4-SW18

WebKit now implements the HTML5 canvas pixel manipulation standard along with the toDataURL() method standard.

[13] Use USVString for all URLs ( (domenic著, )) https://github.com/whatwg/html/commit/018b983b77b2cd908f6d00100e7e0abe893dd2c3

[14] Make quality an explicit argument for canvas image conversion (domenic著, ) https://github.com/whatwg/html/commit/7d25c4c2452b705220417ffb951c9b89e04ba50b

[15] Define encoder failure actions for toDataURL/toBlob (junov著, ) https://github.com/whatwg/html/commit/93c0a157dbe238582584a0e8c2f621958bb39a45

[21] Give toDataURL() and toBlob() default parameter values (GloverDonovan著, ) https://github.com/whatwg/html/commit/b799322188cf33c7caef336bb27fe9223d995b24

[22] Give <canvas>'s toDataURL() and toBlob() default parameter values · Issue #3430 · whatwg/html () https://github.com/whatwg/html/issues/3430

[23] Give toDataURL() and toBlob() default parameter values by GloverDonovan · Pull Request #3477 · whatwg/html () https://github.com/whatwg/html/pull/3477