Safari iOS 6-Ajax請求Blob圖片

Question

我有一個主要在blob對象中下載圖像的函數，它在chrome，FF，iOS 7+上運行良好，但在iOS 6上卻無法運行...

downloadImage: function( url ) {
        var that = this;
        return new Ember.RSVP.Promise(function( resolve, reject ) {
            var xhr = new XMLHttpRequest();
            xhr.open('GET', url);
            xhr.onreadystatechange = function() {
                if (this.readyState === this.DONE) {
                    that.chart.incrementProgress();
                    if (this.status === 200) {
                        var blob = this.response;
                        resolve( that.imageStore.writeImage( that, url, blob ) );
                    }
                    else {
                        resolve();
                    }
                }
            };
            xhr.responseType = 'blob';
            xhr.send();

        });
    }

在iOS6的控制台調試器中，當我想查看我的blob對象時，它似乎是一個帶有超奇怪字符的字符串。.我不確定它是否正常，或者我的請求在此版本的上是否無法正常工作iOS。

之后，我需要將其轉換為base64，因此我使用FileReader這樣的方式：

this.writeImage = function( controller, url, blob ) {
        var that = this;
        return new Ember.RSVP.Promise(function( resolve ) {
            var reader = new window.FileReader();
            reader.readAsDataURL(blob);
            reader.onloadend = function() {
                var base64 = reader.result;
                var object = { id: url, key: url, base64: base64 };
                //controller.store.update('image', object).save();
                controller.store.findQuery('image', { key: url })
                .then(function( result ) {
                    var record = result.content[0];
                    record._data.base64 = base64;
                    record.save().then( resolve );
                })
                .catch(function() {
                    controller.store.createRecord('image', object).save().then( resolve );
                });
            };
        });
    };

不用注意Promise和其他參數，但是blob與downloadImage函數中的blob相同。

而且由於一個神秘的原因， reader.loadend永遠不會觸發，因為reader中的狀態始終為0。

我應該為iOS6做一些特別的事情還是我的代碼錯誤？

[edit]：好像未觸發onloadend回調？

[edit2]：經過進一步調查，似乎來自ajax請求的響應是字符串而不是blob ...而且我的responseType也設置為""嗎？

Answer 1

我現在找到了一種解決方法，我將我的binaryString轉換為這樣的blob：

function binaryStringToBlob( byteCharacters, contentType ) {
    var sliceSize = 1024;
    var bytesLength = byteCharacters.length;
    var slicesCount = Math.ceil(bytesLength / sliceSize);
    var byteArrays = new Array(slicesCount);

    for (var sliceIndex = 0; sliceIndex < slicesCount; ++sliceIndex) {
        var begin = sliceIndex * sliceSize;
        var end = Math.min(begin + sliceSize, bytesLength);

        var bytes = new Array(end - begin);
        for (var offset = begin, i = 0 ; offset < end; ++i, ++offset) {
            bytes[i] = byteCharacters[offset].charCodeAt(0);
        }
        byteArrays[sliceIndex] = new Uint8Array(bytes);
    }
    return new Blob(byteArrays, { type: contentType });
}

您只需要獲取內容類型，然后開始！