File

  • Revision slug: Web/API/File
  • Revision title: File
  • Revision id: 474801
  • Created:
  • Creator: Jeremie
  • Is current revision? No
  • Comment

Revision Content

{{gecko_minversion_header("1.9")}}
{{ APIRef() }}

Summary

The File interface provides information about -- and access to the contents of -- files.

These are generally retrieved from a {{domxref("FileList")}} object returned as a result of a user selecting files using the input element, or from a drag and drop operation's DataTransfer object.

The file reference can be saved when the form is submitted while the user is offline, so that the data can be retrieved and uploaded when the Internet connection is restored.

Properties

{{domxref("File.lastModifiedDate")}} {{readonlyinline}} {{gecko_minversion_inline("15.0")}}
The last modified Date of the file referenced by the File object.
{{domxref("File.name")}} {{readonlyinline}} {{gecko_minversion_inline("1.9.2")}}
The name of the file referenced by the File object.
{{domxref("File.fileName")}} {{non-standard_inline}} {{readonlyinline}} {{obsolete_inline("7.0")}}
The name of the file referenced by the File object.
{{domxref("File.fileSize")}} {{non-standard_inline}} {{readonlyinline}} {{obsolete_inline("7.0")}}
The size of the referenced file in bytes.

The File interface also inherite properties from the {{domxref("Blob")}} interface.

{{page("/en-US/docs/Web/API/Blob","Properties")}}

Methods

{{domxref("File.getAsBinary()")}} {{non-standard_inline}} {{obsolete_inline("7.0")}}
Returns a string containing the file's data in raw binary format.
{{domxref("File.getAsDataURL()")}} {{non-standard_inline}} {{obsolete_inline("7.0")}}
A string containing the file's data encoded as a data: URL.
{{domxref("File.getAsText()","File.getAsText(string encoding)")}} {{non-standard_inline}} {{obsolete_inline("7.0")}}
Returns the file's contents as a string in which the file's data is interpreted as text using a given encoding.

The File interface also inherite methods from the {{domxref("Blob")}} interface.

{{page("/en-US/docs/Web/API/Blob","Methods")}}

Specifications

Specification Status Comment
{{SpecName('File API')}} {{Spec2('File API')}} Initial definition.

Browser compatibility

{{CompatibilityTable}}
Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support 13 {{CompatGeckoDesktop("1.9")}} (non standard)
{{CompatGeckoDesktop("7")}} (standard)
10.0 16.0 {{CompatUnknown}}
Feature Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
basic support {{CompatNo}} {{CompatNo}} {{CompatNo}} {{CompatNo}} {{CompatNo}}

Implementation notes

Gecko notes

  • In Gecko, you can use this API from chrome code. See Using the DOM File API in chrome code for details.
  • Starting in Gecko 6.0 {{geckoRelease("6.0")}}, privileged code (such as extensions) can pass an {{interface("nsIFile")}} object to the DOM File constructor to specify the file to reference.
  • Starting in Gecko 8.0 {{geckoRelease("8.0")}}, you can use new File to create File objects from XPCOM component code instead of having to instantiate the {{interface("nsIDOMFile")}} object directly.

See also

Revision Source

<div>
  {{gecko_minversion_header("1.9")}}</div>
<div>
  {{ APIRef() }}</div>
<h2 id="Summary">Summary</h2>
<p>The <code>File</code> interface provides information about -- and access to the contents of -- files.</p>
<p>These are generally retrieved from a {{domxref("FileList")}} object returned as a result of a user selecting files using the <code>input</code> element, or from a drag and drop operation's <a href="/en-US/docs/DragDrop/DataTransfer" title="DragDrop/DataTransfer"><code>DataTransfer</code></a> object.</p>
<p>The file reference can be saved when the form is submitted while the user is offline, so that the data can be retrieved and uploaded when the Internet connection is restored.</p>
<h2 id="Properties" name="Properties">Properties</h2>
<dl>
  <dt>
    {{domxref("File.lastModifiedDate")}} {{readonlyinline}} {{gecko_minversion_inline("15.0")}}</dt>
  <dd>
    The last modified <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date">Date</a></code> of the file referenced by the <code>File</code> object.</dd>
  <dt>
    {{domxref("File.name")}} {{readonlyinline}} {{gecko_minversion_inline("1.9.2")}}</dt>
  <dd>
    The name of the file referenced by the <code>File</code> object.</dd>
  <dt>
    {{domxref("File.fileName")}} {{non-standard_inline}} {{readonlyinline}} {{obsolete_inline("7.0")}}</dt>
  <dd>
    The name of the file referenced by the <code>File</code> object.</dd>
  <dt>
    {{domxref("File.fileSize")}} {{non-standard_inline}} {{readonlyinline}} {{obsolete_inline("7.0")}}</dt>
  <dd>
    The size of the referenced file in bytes.</dd>
</dl>
<p>The <code>File</code> interface also inherite properties from the {{domxref("Blob")}} interface.</p>
<p>{{page("/en-US/docs/Web/API/Blob","Properties")}}</p>
<h2 id="Method_overview" name="Method_overview">Methods</h2>
<dl>
  <dt>
    {{domxref("File.getAsBinary()")}} {{non-standard_inline}} {{obsolete_inline("7.0")}}</dt>
  <dd>
    Returns a string containing the file's data in raw binary format.</dd>
  <dt>
    {{domxref("File.getAsDataURL()")}} {{non-standard_inline}} {{obsolete_inline("7.0")}}</dt>
  <dd>
    A string containing the file's data encoded as a <code>data:</code> URL.</dd>
  <dt>
    {{domxref("File.getAsText()","File.getAsText(string encoding)")}} {{non-standard_inline}} {{obsolete_inline("7.0")}}</dt>
  <dd>
    Returns the file's contents as a string in which the file's data is interpreted as text using a given encoding.</dd>
</dl>
<p>The <code>File</code> interface also inherite methods from the {{domxref("Blob")}} interface.</p>
<p>{{page("/en-US/docs/Web/API/Blob","Methods")}}</p>
<h2 id="Browser_Compatibility" name="Browser_Compatibility">Specifications</h2>
<table class="standard-table">
  <tbody>
    <tr>
      <th scope="col">Specification</th>
      <th scope="col">Status</th>
      <th scope="col">Comment</th>
    </tr>
    <tr>
      <td>{{SpecName('File API')}}</td>
      <td>{{Spec2('File API')}}</td>
      <td>Initial definition.</td>
    </tr>
  </tbody>
</table>
<h2 id="Browser_compatibility" name="Browser_compatibility">Browser compatibility</h2>
<div>
  {{CompatibilityTable}}</div>
<div id="compat-desktop">
  <table class="compat-table">
    <tbody>
      <tr>
        <th>Feature</th>
        <th>Chrome</th>
        <th>Firefox (Gecko)</th>
        <th>Internet Explorer</th>
        <th>Opera</th>
        <th>Safari (WebKit)</th>
      </tr>
      <tr>
        <td>Basic support</td>
        <td>13</td>
        <td>{{CompatGeckoDesktop("1.9")}} (non standard)<br />
          {{CompatGeckoDesktop("7")}} (standard)</td>
        <td>10.0</td>
        <td>16.0</td>
        <td>{{CompatUnknown}}</td>
      </tr>
    </tbody>
  </table>
</div>
<div id="compat-mobile">
  <table class="compat-table">
    <tbody>
      <tr>
        <th>Feature</th>
        <th>Android</th>
        <th>Firefox Mobile (Gecko)</th>
        <th>IE Phone</th>
        <th>Opera Mobile</th>
        <th>Safari Mobile</th>
      </tr>
      <tr>
        <td>basic support</td>
        <td>{{CompatNo}}</td>
        <td>{{CompatNo}}</td>
        <td>{{CompatNo}}</td>
        <td>{{CompatNo}}</td>
        <td>{{CompatNo}}</td>
      </tr>
    </tbody>
  </table>
</div>
<h3 id="Specification" name="Specification">Implementation notes</h3>
<h4 id="Gecko_notes">Gecko notes</h4>
<ul>
  <li>In Gecko, you can use this API from chrome code. See <a href="/en-US/docs/Extensions/Using_the_DOM_File_API_in_chrome_code" title="Using the DOM File API in chrome code">Using the DOM File API in chrome code</a> for details.</li>
  <li>Starting in Gecko 6.0 {{geckoRelease("6.0")}}, privileged code (such as extensions) can pass an {{interface("nsIFile")}} object to the DOM <code>File</code> constructor to specify the file to reference.</li>
  <li>Starting in Gecko 8.0 {{geckoRelease("8.0")}}, you can use <code>new File</code> to create <code>File</code> objects from XPCOM component code instead of having to instantiate the {{interface("nsIDOMFile")}} object directly.</li>
</ul>
<h2 id="See_also" name="See_also">See also</h2>
<ul>
  <li><a href="/en-US/docs/Using_files_from_web_applications" title="Using files from web applications">Using files from web applications</a></li>
  <li><a href="/en-US/docs/Extensions/Using_the_DOM_File_API_in_chrome_code" title="Extensions/Using the DOM File API in chrome code">Using the DOM File API in chrome code</a></li>
  <li>{{domxref("FileReader")}}</li>
</ul>
Revert to this revision