API файлов HTML5: объект FileReader не определен после возникновения ошибки

Я использую Chrome 12 в Mac OS X и включил jQuery 1.6.1 в документ.

Я пытаюсь прочитать файл со следующим кодом, при чтении файла возникает ошибка, поэтому вызывается this.error.onerror(), но FileReader-Object this.reader больше не существует, и я не могу получить ошибку. Я также не уверен, почему возникает ошибка, это обычный текстовый документ, который я хочу прочитать.

function FileHandler(files, action) {
    console.log('FileHandler called.');

    this.files = files;
    this.reader = new FileReader();
    this.action = action;

    this.handle = function() {
        console.log('FileHandler.handle called.');

        for (var i = 0; i < this.files.length; i++) {
            this.reader.readAsDataURL(files[i]);
        }
    }

    this.upload = function() {
        console.log('FileHandler.upload called.');
        console.log(this.reader);

        data = {
            content: this.reader.result
        }

        console.log(data);
    }

    this.error = function() {
        console.log('An error occurred while reading a file.');
        console.log(this.reader.error);
    }

    this.reader.onload = this.upload;
    this.reader.onerror = this.error;
}

Этот код создает следующий вывод консоли: http://cl.ly/0j1m3j0o3s071Y1K3A25.


person Claudio Albertin    schedule 20.06.2011    source источник
comment
Если вы размещаете свои файлы на веб-сервере, возникает ли у вас такая же проблема? Если вы используете FF вместо Chrome, у вас возникает такая же проблема? Если нет, возможно, вы столкнулись с политикой Chrome в отношении того же происхождения. См. ответ и комментарии здесь: stackoverflow.com/questions/4100927/chrome-filereader /   -  person james.garriss    schedule 16.12.2011


Ответы (2)


Внутри .onerror this не то же самое, что снаружи, потому что это новая функция (с новой областью действия).

Следите за this, установив его статически следующим образом:

var _this = this; // _this won't change
this.reader.onerror = function() {
    console.log('An error occurred while reading a file.');
    console.log(_this.reader.error);
}
person pimvdb    schedule 20.06.2011
comment
Я обновил код так, как мне кажется, он должен работать (по крайней мере, он работает с this.upload). Но ошибка все еще возникает, и вывод консоли такой же. - person Claudio Albertin; 21.06.2011
comment
Вы уверены, что это undefined? Обратите внимание, что _this должен быть определен вне .error. - person pimvdb; 21.06.2011
comment
Что именно вы имеете в виду под «несколько объектов», пожалуйста? - person pimvdb; 21.06.2011
comment
хорошо, но я должен найти способ иметь возможность создавать несколько объектов. Я должен играть с объектом, не устанавливая его как статический. Есть ли хороший способ сделать это? Под несколькими объектами я подразумеваю возможность создания n объектов этого класса с разными переменными экземпляра. - person Claudio Albertin; 21.06.2011
comment
Вместо этого вы можете сделать this.reader.onerror = this.error.bind(this) и снова использовать this (отбросить _this). - person pimvdb; 21.06.2011
comment
Это работает, большое спасибо. Теперь я могу получить номер ошибки. SECURITY_ERR... Но это другая проблема, не так ли? - person Claudio Albertin; 21.06.2011
comment
Я понятия не имею, в чем причина SECURITY_ERR - это из-за bind? Я предполагаю, что это ошибка чтения файла: developer.mozilla.org/en/DOM/FileError. - person pimvdb; 21.06.2011
comment
У меня была ошибка до того, как я использовал .bind(), и я думаю, что это все та же ошибка. Но я действительно понятия не имею, почему возникает SERCURITY_ERR. Должен ли я открыть вопрос как новый вопрос, потому что он не имеет (не напрямую) никакого отношения к неопределенному объекту? - person Claudio Albertin; 21.06.2011
comment
Это хорошая идея (просто заметка, можете ли вы открыть файл в Блокноте?). - person pimvdb; 21.06.2011

Это должен быть правильный способ сделать это:

reader.onerror = function(event) {
    console.error("File could not be read: " + event.target.error);
};
person Nuno Pinto    schedule 09.10.2016