Przesyłanie Html5 Chunk nie działa w Chrome 25?

Mam następujący kod, aby przesłać obraz w kawałku przy użyciu Html5.Przesyłanie Html5 Chunk nie działa w Chrome 25?

<!DOCTYPE html> 
<form> 
<div class="example"> 
    #bytes/chunk: 
    <input id="numChunks" value="1048576" /> 
    <input id="files" class="button" type="file" /> 
    <div id="bars"> 
     <span id="numofchunks">Num of chunks: </span> 
     <br /> 
     <span id="message"></span> 
    </div> 
</div> 
</form> 
<script src="~/Scripts/jquery-1.7.1.js" type="text/javascript"></script> 

<script type="text/javascript"> 
    $(document).ready(function() { 

     document.querySelector('input[type="file"]').addEventListener('change', function (e) { 
      var blob = this.files[0]; 

      var BYTES_PER_CHUNK = (1024 * 1024)/2; // 1MB chunk sizes. 
      var SIZE = blob.size; 
      $('#numofchunks').text($('#numofchunks').text() + SIZE/BYTES_PER_CHUNK); 
      var start = 10; 
      var end = BYTES_PER_CHUNK; 
      var counter = 1; 
      while (start < SIZE) { 
       upload(blob.slice(start, end), counter); 

       start = end; 
       end = start + BYTES_PER_CHUNK; 
       counter = counter + 1; 
      } 
     }, false); 

    }); 

     function upload(blobOrFile, counter) { 
      var xhr = new XMLHttpRequest(); 
      xhr.open('POST', '/basic/html5', true); 
      xhr.setRequestHeader("Content-Type", "image/jpeg"); 
      //   xhr.setRequestHeader("X-File-Name", blobOrFile.fileName); 
      xhr.onload = function() { $('#message').text($('#message').text() + counter + " ") }; 

      var fd = new FormData(); 
      fd.append("fileToUpload", blobOrFile); 
      xhr.send(fd); 
     }; 


</script>

Działa to we wszystkich przeglądarkach, ale nie działa w moim Chrome. W Chrome nie otrzymuję żądania na serwerze. W śledzeniu sieci chrome zawsze wyświetla żądanie jako Oczekujące.

UPDATE: Nie mogę przesłać dużego pliku (więcej niż 1 MB). Nie ma znaczenia, czy ja to zrobię, czy nie, ani wielkości kawałka. Jeśli rozmiar obrazu przekracza 1 MB, nie można go przesłać.

proszę patrz załączony zrzut ekranu błędu enter image description here

Źródło

2013-03-25 Rana

Warto zauważyć, że 'ten.files [0]' nie będzie działał w wersjach IE niższych niż 10. –

Co stanie się, jeśli przejdziesz cały plik? –

@ James: Dzięki, masz rację co do IE. Ale staramy się rozwiązać problem z Chrome. – Rana

Spróbuj

function(){ 
      var blobs = []; 

/* 
* function that uploads a fragment of the file 
*/ 
     function uploadChunk(blob, fileName, fileType){ 

      var xhr = new XMLHttpRequest(); 

      xhr.open('POST', 'upload_chunks.cfm', false); 

      xhr.onload = function(e){ 
       document.getElementById("messages").innerHTML += "Chunk of size " + blob.size + " uploaded successfully.<br/>"; 
      } 

      xhr.setRequestHeader('X_FILE_NAME', fileName); 
      xhr.setRequestHeader('Content-Type', fileType) 
      document.getElementById("messages").innerHTML += "Uploading chunk of size " + blob.size + ".<br/>"; 
      xhr.send(blob); 
     } 

/* 
* Invoke this function when the file is selected. 
*/ 
     document.querySelector('#userfile').addEventListener('change', function(){ 
      var file = this.files[0]; 
      var bytes_per_chunk = 1024 * 1024; 
      var start = 0; 
      var end = bytes_per_chunk; 
      var size = file.size; 

      while (start < size) { 
    //push the fragments to an array 
       blobs.push(file.slice(start, end)); 
       start = end; 
       end = start + bytes_per_chunk; 
      } 

    //upload the fragment to the server 
      while (blob = blobs.shift()) { 
    uploadChunk(blob, file.name, file.type); 
      } 
     }) 
    })();

Od http://www.sagarganatra.com/

Źródło

2013-04-15 15:18:31

Wielkie dzięki, wypróbowałem twój kod i podaje ten błąd: Uncaught Error: NETWORK_ERR: XMLHttpRequest Exception 101 Html5: 71 uploadChunk Html5: 71 (funkcja anonimowa), od pierwszego fragmentu – Rana

Oto Innym możliwym rozwiązaniem

https://github.com/tbela99/uploadManager/tree/master/Source

Kredyt trafia do Thierry Bela

Źródło

2013-04-16 16:32:30

Przesyłanie Html5 Chunk nie działa w Chrome 25?

Odpowiedz

Powiązane problemy