Od wersji 50 Chrome element canvas jest ulepszany: obsługuje teraz metodę toBlob()
. To świetna wiadomość dla wszystkich, którzy generują obrazy po stronie klienta i chcą je na przykład przesłać na serwer lub zapisać w IndexedDB na przyszłość.
function sendImageToServer (canvas, url) {
function onBlob (blob) {
var request = new XMLHttpRequest();
request.open('POST', url);
request.onload = function (evt) {
// Blob sent to server.
}
request.send(blob);
}
canvas.toBlob(onBlob);
}
Korzystanie z funkcji toBlob()
jest bardzo wygodne, ponieważ zamiast manipulować ciągiem tekstowym zakodowanym w formacie base64, który jest uzyskiwany z funkcji toDataURL()
, możesz teraz pracować bezpośrednio z zakodowanymi danymi binarnymi. Jest mniejszy i zazwyczaj pasuje do większej liczby przypadków użycia niż identyfikator URI danych.
Jeśli zastanawiasz się, czy możesz rysować bloby obrazu w innym kontekście płótna, odpowiedź brzmi: „Tak, oczywiście!” (w Firefoxie i Chrome). Możesz to zrobić za pomocą interfejsu createImageBitmap()
API, który również pojawi się w Chrome 50.