Please note, this is a STATIC archive of website developer.mozilla.org from 03 Nov 2016, cach3.com does not collect or store any user information, there is no "phishing" involved.

Revision 940159 of File

  • Revision slug: Web/API/File
  • Revision title: File
  • Revision id: 940159
  • Created:
  • Creator: Nickolay
  • Is current revision? No
  • Comment add link to createImageBitmap

Revision Content

{{APIRef }}

The File interface provides information about files and allows JavaScript in a web page to access their content.

File objects are generally retrieved from a {{domxref("FileList")}} object returned as a result of a user selecting files using the {{ HTMLElement("input") }} element, from a drag and drop operation's {{domxref("DataTransfer")}} object, or from the mozGetAsFile() API on an {{ domxref("HTMLCanvasElement") }}. In Gecko, privileged code can create File objects representing any local file without user interaction (see {{anch("Gecko notes")}} for more information.)

A File object is specific kind of a {{domxref("Blob")}}, and can be used in any context that a Blob can. In particular, {{domxref("FileReader")}}, {{domxref("URL.createObjectURL()")}}, {{domxref("ImageBitmapFactories.createImageBitmap()", "createImageBitmap()")}}, and {{domxref("XMLHttpRequest", "", "send()")}} accept both Blobs and Files.

See Using files from web applications for more information and examples.

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.

The File interface also inherits properties from the {{domxref("Blob")}} interface:

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

Methods

The File interface doesn't define any methods, but inherits 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 11.5 6.0
Feature Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
basic support {{CompatNo}} 25 {{CompatNo}} 11.1 6.0

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. To use from chrome code, JSM and Bootstrap scope, you have to import it using Cu.importGlobalProperties(['File']);
  • 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. The constructor takes, in contrast to Blob, as second argument the filename. The filename can be any String. 
    File File(
      Array parts,
      String filename, 
      BlobPropertyBag properties
    );
  • The following non-standard properties and methods were removed in Gecko 7 {{geckoRelease("7.0")}}: {{domxref("File.fileName")}}, {{domxref("File.fileSize")}}, {{domxref("File.getAsBinary()")}}, {{domxref("File.getAsDataURL()")}}, {{domxref("File.getAsText()","File.getAsText(string encoding)")}} ({{bug("661876")}}). Standard properties {{domxref("File.name")}}, {{domxref("Blob.size")}}, and methods on {{domxref("FileReader")}} should be used instead.

See also

Revision Source

<div>{{APIRef }}</div>

<p>The <strong><code>File</code></strong> interface provides information about files and allows JavaScript in a web page to access their content.</p>

<p><code>File</code> objects are generally retrieved from a {{domxref("FileList")}} object returned as a result of a user selecting files using the&nbsp;{{ HTMLElement("input") }}&nbsp;element, from a drag and drop operation's {{domxref("DataTransfer")}} object, or from the&nbsp;<code>mozGetAsFile()</code>&nbsp;API on an&nbsp;{{ domxref("HTMLCanvasElement") }}. In Gecko, privileged code can create <code>File</code> objects representing any local file without user interaction (see {{anch("Gecko notes")}} for more information.)</p>

<p>A <code>File</code> object is specific kind of a {{domxref("Blob")}}, and can be used in any context that a Blob can. In particular, {{domxref("FileReader")}}, {{domxref("URL.createObjectURL()")}}, {{domxref("ImageBitmapFactories.createImageBitmap()", "createImageBitmap()")}}, and {{domxref("XMLHttpRequest", "", "send()")}} accept both <code>Blob</code>s and <code>File</code>s.</p>

<p>See <a href="/en-US/docs/Using_files_from_web_applications">Using files from web applications</a> for more information and examples.</p>

<h2 id="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>
</dl>

<p><em>The <code>File</code> interface also inherits properties from the {{domxref("Blob")}} interface:</em></p>

<p>{{Page("/en-US/docs/Web/API/Blob", "Properties")}}</p>

<h2 id="Methods">Methods</h2>

<p><em>The <code>File</code> interface doesn't define any methods, but inherits methods from the {{domxref("Blob")}} interface:</em></p>

<p>{{Page("/en-US/docs/Web/API/Blob", "Methods")}}</p>

<h2 id="Specifications">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">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>11.5</td>
   <td>6.0</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>25</td>
   <td>{{CompatNo}}</td>
   <td>11.1</td>
   <td>6.0</td>
  </tr>
 </tbody>
</table>
</div>

<h3 id="Implementation_notes">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. To use from chrome code, JSM and Bootstrap scope, you have to import it using <code><a href="/en-US/docs/Components.utils.importGlobalProperties">Cu.importGlobalProperties</a>(['File']);</code></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. The constructor takes, in contrast to Blob, as second argument the filename. The filename can be any String.&nbsp;
  <pre class="syntaxbox">
File File(
&nbsp; Array parts,
&nbsp; String filename, 
  BlobPropertyBag properties
);</pre>
 </li>
 <li>The following non-standard properties and methods were removed in Gecko 7 {{geckoRelease("7.0")}}: {{domxref("File.fileName")}}, {{domxref("File.fileSize")}}, {{domxref("File.getAsBinary()")}}, {{domxref("File.getAsDataURL()")}}, {{domxref("File.getAsText()","File.getAsText(string encoding)")}} ({{bug("661876")}}). Standard properties {{domxref("File.name")}}, {{domxref("Blob.size")}}, and methods on {{domxref("FileReader")}} should be used instead.</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>{{domxref("FileReader")}}</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> (for privileged code running in Gecko, such as Firefox add-ons)</li>
</ul>
Revert to this revision