JavaScript. Подробное руководство, 6-е издание, Флэнаган Дэвид

JavaScript. Подробное руководство, 6-е издание

на обложку

Флэнаган Дэвид

Шрифт:

var uploading = false;

console.log(target.url);

target.ondragenter = function(e) {

console. log("dragenter");

if (uploading) return; // Игнорировать попытку сброса, если

// элемент уже занят выгрузкой файла

var types = e.dataTransfer.types;

if (types &&

((types.contains && types.contains("Files")) ||

(types.indexOf && types.index0f("Files”) !== -1))) {

target.classList.add("wantdrop");

return false;

}

};

target.ondragover = function(e) {

if (!uploading) return false;

};

target.ondragleave = function(e) {

if (!uploading) target.classList.remove("wantdrop");

};

target.ondrop = function(e) {

if (uploading) return false;

var files = e.dataTransfer.files;

if (files && files.length) {

uploading = true;

var message = "Выгружаются файлы:<ul>";

for(var і = 0; і < files.length; i++)

message += "<li>" + files[i].name + "</li>";

message += "</ul>";

target.innerHTML = message;

target.classList.remove("wantdrop");

target.classList.add("uploading");

var xhr = new XMLHttpRequest;

xhr.open("POST", url);

var body = new FormData;

for(var i=0; і < files.length; i++)

body.append(i, files[і]);

xhr.upload.onprogress = function(e) {

if (e.lengthComputable) {

target.innerHTML = message +

Math.round(e.loaded/e.total*100) +

"% Завершено";

}

};

xhr.upload.onload = function(e) {

uploading = false;

target.classList.remove("uploading");

target.innerHTML = "Отбуксируйте сюда файл для выгрузки";

};

xhr.send(body);

return false;

}

target.classList. removefwantdrop");

}

});

18.1.5. Прерывание запросов и предельное время ожидания

Выполнение HTTP-запроса можно прерывать вызовом метода

abort

объекта

XMLHttpRequest

. Метод

abort

доступен во всех версиях объекта

XMLHttpRequest

, и согласно спецификации «XHR2» вызов метода

abort

генерирует событие «abort». (На момент написания этих строк некоторые броузеры уже поддерживали событие «abort». Наличие этой поддержки можно определить по присутствию свойства

onabort

в объекте

XMLHttpRequest

Основная причина для вызова метода

abort

– появление необходимости отменить запрос, превышение предельного времени ожидания или если ответ становится ненужным. Допустим, что объект

XMLHttpRequest

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

Спецификация «XHR2» определяет свойство

timeout

, в котором указывается промежуток времени в миллисекундах, после которого запрос автоматически будет прерван, а также определяет событие «timeout», которое должно генерироваться (вместо события «abort») по истечении установленного промежутка времени. На момент написания этих строк броузеры еще не поддерживали автоматическое прерывание запроса по истечении предельного времени ожидания (и объекты

XMLHttpRequest

в них не имели свойств

timeout

ontimeout

). Однако имеется возможность реализовать собственную поддержку прерывания запросов по истечении заданного интервала времени с помощью функции

setTimeout

(раздел 14.1) и метода

abort.

Как это сделать, демонстрирует пример 18.12.