2014-10-19 7 views
0

При отправке XMLHttpRequest с async = false события xhr.upload.onprogress никогда не запускаются при загрузке файла.XMLHttpRequest onprogress не работает на async = false

Источник:

var form = new FormData(); 
form.append("name", files[i].name); 
form.append("size", files[i].size); 
form.append("type", files[i].type); 
form.append("image", files[i]); 

var xhr = new XMLHttpRequest(); 

xhr.upload.onprogress = function(evt){ 
    alert("Progress event fired!"); 
    if (evt.lengthComputable) 
    { 
     var percentComplete = (evt.loaded/evt.total)*100; 
     console.log(percentComplete); 
    } 
}; 

xhr.onload = function() { 
    console.log(files[i].name + " uploaded!"); 
}; 

xhr.open("post", "/images/upload", false); 
xhr.send(form); 

Я испытал это как в Firefox и Chrome.

Я понятия не имею, пропустил ли я какую-либо документацию, но не смог найти ничего, что указывало бы, что событие xhr.upload.onprogress не запускается, когда async = false ?.

Если я изменяю запрос на запуск с помощью async = true, он запускается.

+0

В [раздел 4.5.6 спецификации] (https://xhr.spec.whatwg.org/) вы можете прочитать, что спецификация говорит о событиях прогресса. – jfriend00

+0

Первое правило о синхронных HTTP-запросах: вы их не используете. Когда-либо. *Когда-либо.* – Tomalak

ответ

1

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

Использование синхронизации запросов, вы блок выполнение потока, пока все не будет сделано (файл загружен), и даже если onprogress событие будет уже уволили, вы не могли обновлять какие-либо прогресс баров, потому что UI и все другие обработка (но загрузка файла) будет заблокирована.

Эти события были созданы так, что вы могли обрабатывать асинхронные запросы.

Если вы читаете here, вы увидите, что синхронные запросы устарели в некоторых версиях браузера.

Смежные вопросы