javascript - FileReader.readAsArrayBuffer return is null - Stack Overflow

admin管理员组

文章数量:1310493

I am following Html5rocks tutorial

/

and I am trying to use readAsArrayBuffer instead of readAsBinaryString in slicing a file example (because I want to read gif header to find file resolution). But I am stuck because evt.target.result (while using readAsBinaryString it is a string)

any ideas?

EDIT : Code

reader.onloadend = function(evt) 

{

  if (evt.target.readyState == FileReader.DONE) { // DONE == 2
    document.getElementById('byte_content').textContent = evt.target.result;
    console.log(evt.target.result.byteLenght)
    document.getElementById('byte_range').textContent = 
        ['Read bytes: ', start + 1, ' - ', stop + 1,
         ' of ', file.size, ' byte file'].join('');
  }
};

if (file.webkitSlice) {
  var blob = file.webkitSlice(start, stop + 1);
} else if (file.mozSlice) {
  var blob = file.mozSlice(start, stop + 1);
}
reader.readAsArrayBuffer(blob);
}

so in Firefox 13 I get on screen : [object ArrayBuffer]

and on console log : undefined

while in Chromium 18 I get on console : Uncaught TypeError: Cannot read property 'byteLenght' of null

I am following Html5rocks tutorial

http://www.html5rocks./en/tutorials/file/dndfiles/

and I am trying to use readAsArrayBuffer instead of readAsBinaryString in slicing a file example (because I want to read gif header to find file resolution). But I am stuck because evt.target.result (while using readAsBinaryString it is a string)

any ideas?

EDIT : Code

reader.onloadend = function(evt) 

{

  if (evt.target.readyState == FileReader.DONE) { // DONE == 2
    document.getElementById('byte_content').textContent = evt.target.result;
    console.log(evt.target.result.byteLenght)
    document.getElementById('byte_range').textContent = 
        ['Read bytes: ', start + 1, ' - ', stop + 1,
         ' of ', file.size, ' byte file'].join('');
  }
};

if (file.webkitSlice) {
  var blob = file.webkitSlice(start, stop + 1);
} else if (file.mozSlice) {
  var blob = file.mozSlice(start, stop + 1);
}
reader.readAsArrayBuffer(blob);
}

so in Firefox 13 I get on screen : [object ArrayBuffer]

and on console log : undefined

while in Chromium 18 I get on console : Uncaught TypeError: Cannot read property 'byteLenght' of null

• javascript
• html
• fileapi

Share Improve this question Follow edited Jun 18, 2012 at 21:04 wonglik asked Jun 18, 2012 at 20:37 wonglikwonglik 1,06944 gold badges1818 silver badges3737 bronze badges 4

• 1 Where exactely are you stuck? this is the base code. Now, what are your modifications, what did you expect and what goes wrong? – Rob W Commented Jun 18, 2012 at 20:46
• @RobW I changed reader.readAsBinaryString(blob); to eader.readAsArrayBuffer(blob) and I was expecting to get ArrayBufferbut I get null. – wonglik Commented Jun 18, 2012 at 20:51
• 1 Can't reproduce in Chromium 18: jsfiddle/XDbnJ I see [object arrayBuffer]. Include your code in the question, including details about your browser and your expectations. – Rob W Commented Jun 18, 2012 at 20:57
• I can still not reproduce the error: jsfiddle/XDbnJ/1. Also, byteLength has to be spelled with th, not ht. Post a full demo using jsfiddle whihc shows your problem. – Rob W Commented Jun 18, 2012 at 22:01

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 5

There is a typing mistake in:

console.log(evt.target.result.byteLenght)

byteLenght should be byteLength

本文标签： javascriptFileReaderreadAsArrayBuffer return is nullStack Overflow