3

専門家の皆様、再開可能なチャンク アップロード用に作成した BLOB チャンクをループする問題に直面しています。私がフォローしている方法は次のとおりです。Blob.slice() を使用してアップロードするファイルをチャンクし、すべてのチャンクをキューにプッシュしてサーバーに送信しようとします。

私が直面している問題は、チャンクのループに関するものです。最初のチャンクが正常に送信され、xhr.onreadystatechange に委譲された関数から、後述の uploadNext メソッドに行き着きます。ここまでは問題ありませんでしたが、このコードは最初の 2 つのチャンクを送信した後に停止し、ループしません。

次のコードは、これまでに達成したものです。

uploadFile: function(item, location, start, isresume) {
        var blob = item.file;

        const BYTES_PER_CHUNK = 1024 * 200 * 10; 
        const SIZE = blob.size;

        var chunkId = 0;
        var end = BYTES_PER_CHUNK;

        while(start < SIZE) {
            var chunkObj = {};
            // Note: blob.slice has changed semantics and been prefixed. See http://goo.gl/U9mE5.
            end = start + BYTES_PER_CHUNK;
            if(end > SIZE){
                end = SIZE;
            }
            if ('mozSlice' in blob) {
                chunkObj["chunk"] = blob.mozSlice(start, end);
                chunkObj["id"] = chunkId;
            } else {
                // var chunk = blob.webkitSlice(start, end);
                chunkObj["chunk"] = blob.slice(start, end);
                chunkObj["start"] = start;
                chunkObj["end"] = end-1;
                chunkObj["id"] = chunkId;
            }
            chunkId++;
            item.chunks.push(chunkObj);

            start = end ;
        }
        this.upload(item, location, SIZE, isresume);
    },

    upload: function(item, location, SIZE, isresume) {
        var xhr = new XMLHttpRequest();
        // Upload the first chunk
        xhr.upload.addEventListener("error", this.onFileUploadError.createDelegate(this, [item, xhr], 0), false);
        xhr.onload = this.getStatus.createDelegate(this, [item, xhr, isresume], 0);
        xhr.onreadystatechange = this.isChunkUploaded.createDelegate(this, [item, item.chunks[0], xhr, 0, SIZE, location, isresume], 0);
        xhr.open("PUT", location, true);
        xhr.setRequestHeader("Content-Range", "bytes " + item.chunks[0].start + "-" + item.chunks[0].end + "/" + SIZE);
        xhr.send(item.chunks[0].chunk);
    },

    uploadNext: function(item, xhr, index, SIZE, location, isresume) {
        if(index > item.chunks.length) {
            return;
        }

        console.log("uploading next chunk");

        xhr = new XMLHttpRequest();
        xhr.upload.addEventListener("error", this.onFileUploadError.createDelegate(this, [item, xhr], 0), false);
        xhr.onload = this.getStatus.createDelegate(this, [item, xhr, isresume], 0);
        xhr.onreadystatechange = this.isChunkUploaded.createDelegate(this, [item, xhr], 0);
        xhr.open("PUT", location, true);
        xhr.setRequestHeader("Content-Range", "bytes " + item.chunks[index].start + "-" + item.chunks[index].end + "/" + SIZE);
        xhr.send(item.chunks[index].chunk);
        //this.uploadNext(item, xhr, index + 1, SIZE, location, isresume);
    },

    isChunkUploaded: function(item, chunkObj, request, index, SIZE, location, isresume, e) {
        if (request.readyState === 4) {
            console.log("chunk " + index + " uploaded");
            this.uploadNext(item, request, index + 1, SIZE, location, isresume);
        }
    },

PS私は同じためにjqueryを使用することはできません（理由は聞かないでください）。

4

1 に答える 1

0

気にしないでください、これは正しく機能しています。関数の引数として予想よりも少ない関数パラメーターを送信して、自分の側でエラーを起こしました。

于 2012-09-03T08:25:45.690 に答える