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

構文

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 版 ChromeEdge MobileAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung Internet
基本対応Chrome 完全対応 7Edge 完全対応 ありFirefox 完全対応 3.6IE 完全対応 10Opera 完全対応 11Safari 完全対応 6WebView Android ? Chrome Android 完全対応 ありEdge Mobile 完全対応 ありFirefox Android 完全対応 32Opera Android 完全対応 11Safari iOS 完全対応 6.1Samsung Internet Android ?

凡例

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

関連情報

ドキュメントのタグと貢献者

このページの貢献者: silverskyvicto, clariroid
最終更新者: silverskyvicto,