Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Мультизагрузка файлов по частям (https://javascript.ru/forum/events/51407-multizagruzka-fajjlov-po-chastyam.html)

cript 06.11.2014 04:05

Мультизагрузка файлов по частям
 
Приветствую!
Есть форма, через которую проходит загрузка файлов через FileReader. При загрузке одного файла все срабатывает, но если выбрать несколько файлов то все идет не так, загружается последний файл, а те, что идут за ним не догружаются, посмотрите, что не так с этим кодом
if(!XMLHttpRequest.prototype.sendAsBinary) { 
XMLHttpRequest.prototype.sendAsBinary = function(datastr){ function byteValue(x) { return x.charCodeAt(0) & 0xff; } var ords = Array.prototype.map.call(datastr, byteValue); var ui8a = new Uint8Array(ords); this.send(ui8a.buffer); } }
function FileUploader(options) { 
this.filesize = 0; 
this.file = null; 
this.options = options;
this.position = 0;  
this.CheckBrowser = function(){ 
if(window.File && window.FileReader && window.FileList && window.Blob) { return true; } else { return false; } } 
this.UploadPortion = function(id,from,filename,filesize){ 
var reader = new FileReader(); var that = this; var loadfrom = from; var blob = null; 
var xhrHttpTimeout = null; 
reader.onloadend = function(evt){ 
if(evt.target.readyState == FileReader.DONE) { 
var xhr = new XMLHttpRequest(); 
xhr.open('POST', './upload', true); xhr.setRequestHeader("Content-Type", "application/x-binary; charset=x-user-defined"); 
xhr.setRequestHeader("Upload-Id", id); 
xhr.setRequestHeader("Portion-From", from); 
xhr.setRequestHeader("File-Name", filename);
xhr.setRequestHeader("File-Size", filesize); 
xhr.setRequestHeader("Portion-Size", that.options['portion']); 
that.xhrHttpTimeout = setTimeout(function(){ xhr.abort(); },that.options['timeout']); 
xhr.addEventListener("load", function(evt){ 
clearTimeout(that.xhrHttpTimeout);
 if(evt.target.status!=200) { alert(evt.target.responseText); return; }
that.position+=that.options['portion']; 
if(filesize > that.position) { that.UploadPortion(id,that.position,filename,filesize); 
} else {
alert('done');
} }, false);
xhr.sendAsBinary(evt.target.result); } }; 
that.blob = null; 
if(this.file.slice) { 
that.blob = this.file.slice(from,from+that.options['portion']); 
} else { 
if(this.file.webkitSlice) { that.blob = this.file.webkitSlice(from,from+that.options['portion']); 
} else {
if(this.file.mozSlice) { that.blob = this.file.mozSlice(from,from+that.options['portion']); } 
} } 
reader.readAsBinaryString(that.blob); 
} 
this.Upload = function(id,filename,filesize){ 
if(!this.file) { return -1; } else { 
this.UploadPortion(id,0,filename,filesize); 
} } 
if(this.CheckBrowser()) { 
this.options['portion'] = 1048576; 
this.options['timeout'] = 150000;
var that = this; 
document.getElementById('files').addEventListener('change', function(evt){ 
var files = evt.target.files; 
for(var i=0; i < files.length; i++) { 
var f = files[i]; that.filename = f.name; that.filesize = f.size; that.file = f; 
var rid = RandomCode(32); //новый id загрузки
if(i==0) { var cur_id = that.options['uploadid']; } else { var cur_id = rid; } 
that.Upload(cur_id,that.filename,that.filesize); 
}
(arguments[0].preventDefault)? arguments[0].preventDefault(): arguments[0].returnValue = false; 
}, false);
} }

<input type="file" id="files" name="files[]" multiple>
<script type="text/javascript">
function Form() {var uploader = new FileUploader({ uploadid: '<?=$id?>'});
if(!uploader.CheckBrowser()) 
{
alert(error);
}
}
window.onload = Form();
</script>

kostyanet 06.11.2014 06:30

Код все равно не ваш. Скачайте pluploader и не мучайтесь.

cript 06.11.2014 15:21

Цитата:

Сообщение от kostyanet (Сообщение 339289)
Код все равно не ваш. Скачайте pluploader и не мучайтесь.

Посмотрел я "pluploader" - работает на jquery + загружает файлы по очереди, а в моем примере загружаются все выбранные файлы

kostyanet 06.11.2014 15:29

Тогда еще проще - отгружайте форму целиком и не мучайтесь. Все файлы гурьбой и уйдут.

kostyanet 06.11.2014 16:00

Вспомнил, есть такой скриптик - ноу JQ, все остальное имеется. https://github.com/bgrins/filereader.js

cript 06.11.2014 20:04

Это все не то.
Может кто нибудь знает как по данному коду реализовать хотя бы поочередную загрузку? То есть выбрали несколько файлов, пошла загрузка первого, но где хранить данные о последующих файлах для их дальнейшей загрузки?

kostyanet 06.11.2014 22:10

Это прикол такой? Вам же не надо по-очереди, вам же надо по-очереди... надо выбрать в какой очереди стоять сперва.

Из формы все файлы уходят как хотят, вы не можете этого контролировать. Кстати это легко увидеть если приделать прогресс к форме. Бар колбасит нипадецки.

У вас гавнокод, его чинить только за деньги. Чувак с гитхаба написал отличную вещь, там даже фоновая загрузка есть через Worker'а, синхронная то есть. PlUploader вообще все юзают кому одни только файлы закачивать надо.

cript 06.11.2014 23:58

В общем по моему лучший вариант из всего предложенного это resumable (resumablejs.com), поддерживается докачка, параллельная загрузка и еще много чего..

kostyanet 07.11.2014 06:16

Это когда были модемы была докачка и водокачка. "Параллельность" сам IP обеспечивает, из-за чего прогресс и колбасит.

Ну то есть какая вообще докачка через браузер? Ну то есть можно, но такое нормально делается в приложениях.


Часовой пояс GMT +3, время: 18:26.