تمت إضافة دعم Canvas toBlob() في Chrome 50

Paul Lewis

سيتم ترقية عنصر اللوحة اعتبارًا من الإصدار 50 من Chrome: أصبح الآن متوافقًا مع الطريقة toBlob(). هذه أخبار رائعة لأي شخص ينشئ صورًا من جهة العميل، ويريد مثلاً تحميلها إلى خادمه أو تخزينها في IndexedDB لاستخدامها في المستقبل.

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);
}

من الرائع استخدام toBlob()، لأنّه بدلاً من التلاعب بسلسلة بترميز base64 تحصل عليها من toDataURL()، يمكنك الآن العمل مع البيانات الثنائية المشفّرة مباشرةً. وهو أصغر حجمًا، ويناسب حالات استخدام أكثر من عناوين URL للبيانات.

إذا كنت تتساءل عما إذا كان بإمكانك رسم مُجمّعات صور في سياق لوحة أخرى، الإجابة هي "نعم" في Firefox وChrome. يمكنك إجراء ذلك باستخدام واجهة برمجة تطبيقات createImageBitmap()، والتي ستتوفّر أيضًا في الإصدار 50 من Chrome.