Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Which browsers (and versions) support the Canvas.toBlob method?

I'm working on a minimalist image creation project and I need to have the ability to create images within the browser that are in-turn used on a server. So far, the Canvas.toDataUrl() method has met our needs, but I just learned of the Canvas.toBlob() method which would be much more convenient.

It appears that the toBlob() method is new to the specification by a few months (I can't find any direct reference to when it was added.)

What browsers support toBlob and more importantly which versions of those browsers included the integration of the method? Additionally, is support for this feature "buggy" or in development for any major browsers?

UPDATE

I asked this question nearly 8 year ago. I had tabled my previous mentioned project, waiting for any updates on the status of the canvas.toBlob() method. From what I can gather on the web, implementation of toBlob() appears to be trickling into use across some browsers.

I ask once again, how ubiquitous is the canvas.toBlob() method amongst browsers that have begun integrating the HTML5 canvas object and which versions of those browsers were the first to integrate this support?

like image 777
RLH Avatar asked Jul 18 '11 16:07

RLH


People also ask

What browser is compatible with Canvas?

For best performance, Canvas should be used on the current or first previous major release of Chrome or Firefox. Because it's built using web standards, Canvas runs on Windows, Mac, Linux, iOS, Android, or any other device with a modern web browser.

What browsers support Canvas HTML?

Browser support The element is supported by the current versions of Mozilla Firefox, Google Chrome, Internet Explorer, Safari, Konqueror, Opera and Microsoft Edge.

Does Canvas support all browsers?

Firefox really is your best bet when using Canvas. All browsers are supported by Canvas but we have seen issues come up when saving documents in Chrome or Internet Explorer.

Which browsers do not support Canvas?

Canvas does not support Internet Explorer. You will experience many problems if you use this unsupported browser. These problems include course content not opening correctly or showing up and problems submitting assignments. Firefox, Chrome (or Safari for Mac users) really are the best bets when using Canvas.


2 Answers

As of Feb 2016, these browsers support toBlob()

  • Firefox 19
  • Chrome 50
  • IE10 as the prefixed msToBlob()

Note this answer was originally written in 2011. Original answer/edits below.


toBlob() is really new and I would not recommend using it in a consumer app unless you can explicitly ask them to use a particular browser (or else control the environment).

toBlob() Was added on May 12th and is of limited functionality as-defined. It does not exist in the Chrome nightly, firefox nightly, nor IE9.

It is worth noting that Firefox does have a functional mozGetAsFile

There is yet to even be any discussion for adding it to Chrome.

The discussion for Firefox. They have decided to wait until the spec is more clear before they attempt an implementation.

The spec for toBlob() is very vague with a lot of internal questions still unresolved. They aren't even sure what params to allow for typical toBlob() use yet.


Update on April 10th, 2012

toBlob still enjoys no support. It still does not exist on Chrome Canary (Nightly), Firefox Nightly, nor IE9.

If you want to watch for updates in Chrome star this:

http://code.google.com/p/chromium/issues/detail?id=67587

If you want to watch for updates in Firefox subscribe to this bug here:

https://bugzilla.mozilla.org/show_bug.cgi?id=648610

Update: As of February 21 2016 .toBlob now works in chrome 50 (currently canary)

like image 61
Simon Sarris Avatar answered Sep 24 '22 18:09

Simon Sarris


If you may need it, this js file implement toBlob function in browsers which don't support it already: https://github.com/eligrey/canvas-toBlob.js

Here the post by the authors and here the expanded source code.

However, it looks like even this library doesn't works in all the browsers, as it

"requires BlobBuilder support to function, which is not present in all browsers"

like image 28
Saturnix Avatar answered Sep 21 '22 18:09

Saturnix