FileReader.result

FileReaderresult プロパティは、ファイルの内容を返します。このプロパティは、読み取り操作が完了した後でのみ有効で、データの形式は、読み取り操作を開始するために使用されたメソッドによって異なります。

構文

var file = instanceOfFileReader.result

読み取り操作を開始するためにどの読み取りメソッドが使用されたかに基づく、適切な文字列または ArrayBuffer です。読み取りがまだ完了していないか、失敗した場合は、値は null になります。

結果の型は以下に記載されています。

メソッド 説明
readAsArrayBuffer() result はバイナリデータを含む JavaScript の ArrayBuffer になります。
readAsBinaryString() result にはファイルからの生のバイナリデータが文字列で格納されます。
readAsDataURL() result はファイルのデータを表す data: URL の文字列になります。
readAsText() result は文字列のテキストです。

この例は、ファイル入力からファイルを読み込む関数 read() を示しています。これは FileReader オブジェクトを作成し、 load イベントのリスナーを作成し、ファイルが読み込まれるとその result を取得し、提供されたコールバック関数を read() に渡すことによって機能します。

内容は生のテキストデータとして扱われます。

var fileInput = document.querySelector('input[type="file"]');

function read(callback) {
  var file = fileInput.files.item(0);
  var reader = new FileReader();

  reader.onload = function() {
    callback(reader.result);
  }

  reader.readAsText(file);
}

仕様書

仕様書 状態 備考
File API
FileReader の定義
草案 初回定義

ブラウザーの互換性

Update compatibility data on GitHub
デスクトップモバイル
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung Internet
resultChrome 完全対応 7Edge 完全対応 12Firefox 完全対応 3.6IE 完全対応 10Opera 完全対応 11Safari 完全対応 6WebView Android 完全対応 ありChrome Android 完全対応 ありFirefox Android 完全対応 32Opera Android 完全対応 11Safari iOS 完全対応 6.1Samsung Internet Android ?

凡例

完全対応  
完全対応
実装状況不明  
実装状況不明

関連情報