Javascript Canvas toBlob在iPhone Safari上不起作用？

我尝试将画布图像转换为水滴。这可以通过。 它在桌面浏览器上工作，但在iPhone上我没有得到任何blob。大小始终为零

下面是一个JSFIDLE：

如何在iPhone上从画布上获取水滴？

以下是我使用的代码：

    <input id="file" type="file" />

    <img id="img">

    <br>canvas<br>

    <canvas id="mycanvas" ></canvas>


<script type="text/javascript">

$(function(){

    var $inputFile = $("#file"),
    inputFile = $inputFile[0],
    $img = $("#img"),
    img = $img[0];


    var tmpImage = img; // document.createElement("img");


    $inputFile.on("change", function() {
        var files = inputFile.files;

        if (!files || !files.length) 
            return

        var reader = new FileReader()

        reader.onload = function(progressEvent) {

            console.log("reader.result: "+reader.result);

            tmpImage.onload = function() {
                var canvas = $("#mycanvas")[0]; //document.createElement("canvas"),
                context = canvas.getContext("2d");

                canvas.width = this.width;
                canvas.height = this.height;
                context.drawImage(this, 0, 0);


                var dataUrlValue = canvas.toDataURL(); //canvas.toDataURL("image/jpeg");
                alert(dataUrlValue);
                var myBlob1 = dataURItoBlob(dataUrlValue);
                console.log(myBlob1);
                alert(myBlob1.size);


                canvas.toBlob(function(blob) {
                    console.log("done");
                    alert(blob.size);


                }, 'image/jpeg');

            }; // end onload
            tmpImage.src = reader.result;   

        };
        reader.readAsDataURL(files[0]);


    });


});  // end JQuery
</script>

您可以使用

var data = context.getImageData(0, 0, IMAGE_WIDTH, IMAGE_HEIGHT);

返回数组的每个元素都是图像的一个字节，考虑到图像是按RGB顺序的每像素3个字节

for(var i = 0; i < data.length; i++) {
  // do something for saving the data (bytes) in the format you need
  // ... if you need to
}

for（变量i=0；i

使用此插件将画布元素转换为Blob对象

---

然后以与本机实现相同的方式使用canvas.toBlob（）方法

哦，对不起，我刚刚意识到它实际上与IOS不兼容。您有什么解决方案吗