URL.createObjectURL

  • Revision slug: Web/API/URL.createObjectURL
  • Revision title: URL.createObjectURL
  • Revision id: 455485
  • Created:
  • Creator: teoli
  • Is current revision? No
  • Comment

Revision Content

{{DOMRef("URL")}}{{SeeCompatTable}}

Summary

The URL.createObjectURL() static method creates a {{domxref("DOMString")}} containing an URL representing the object given in parameter. The URL lifetime is tied to the {{domxref("document")}} in the window on which it was created. The new object URL represents the specified {{domxref("File")}} object or {{domxref("Blob")}} object.

Syntax

objectURL = URL.createObjectURL(blob);

Parameters

blob
Is a {{domxref("File")}} object or a {{domxref("Blob")}} object to create a object URL for.

Example

See Using object URLs to display images.

Notes

Each time you call createObjectURL(), a new object URL is created, even if you've already created one for the same object. Each of these must be released by calling {{domxref("URL.revokeObjectURL()")}} when you no longer need them. Browsers will release these automatically when the document is unloaded; however, for optimal performance and memory usage, if there are safe times when you can explicitly unload them, you should do so.

Specifications

Specification Status Comment
{{SpecName('File API', '#dfn-createObjectURL', 'URL')}} {{Spec2('File API')}} Initial definition.

Browser compatibility

{{CompatibilityTable}}

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support 8 with URL prefixed as webkitURL
{{CompatChrome(23)}}
{{CompatGeckoDesktop(2)}} {{CompatIE(10)}} {{CompatOpera(15)}} with URL prefixed as webkitURL {{CompatSafari(6)}} with URL prefixed as webkitURL
In a {{ domxref("Worker", "Web Worker") }} 10 with URL prefixed as webkitURL
{{CompatChrome(23)}}
{{CompatGeckoDesktop(21)}} {{CompatIE(11)}} {{CompatOpera(15)}} with URL prefixed as webkitURL {{CompatSafari(6)}} with URL prefixed as webkitURL
Feature Chrome for Android Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Basic support 18 with URL prefixed as webkitURL 4.0 with URL prefixed as webkitURL {{CompatGeckoMobile(14)}} {{CompatUnknown}} {{CompatOpera(15)}} with URL prefixed as webkitURL 6.0 with URL prefixed as webkitURL
In a {{ domxref("Worker", "Web Worker") }} 18 with URL prefixed as webkitURL {{CompatVersionUnknown}} with URL prefixed as webkitURL {{CompatGeckoMobile(14)}} {{CompatUnknown}} {{CompatOpera(15)}} with URL prefixed as webkitURL 6.0 with URL prefixed as webkitURL

See also

Revision Source

<p name="Summary">{{DOMRef("URL")}}{{SeeCompatTable}}</p>
<h2 id="Summary" name="Summary">Summary</h2>
<p>The <strong><code>URL.createObjectURL()</code></strong> static method creates a {{domxref("DOMString")}} containing an URL representing the object given in parameter. The URL lifetime is tied to the {{domxref("document")}} in the window on which it was created. The new object URL represents the specified {{domxref("File")}} object or {{domxref("Blob")}} object.</p>
<h2 id="Syntax" name="Syntax">Syntax</h2>
<pre class="syntaxbox">
<em>objectURL</em> = URL.createObjectURL(<em>blob</em>);
</pre>
<h2 id="Parameters">Parameters</h2>
<dl>
  <dt>
    <em>blob</em></dt>
</dl>
<dl>
  <dd>
    Is a {{domxref("File")}} object or a {{domxref("Blob")}} object to create a object URL for.</dd>
</dl>
<ul>
</ul>
<h2 id="Example" name="Example">Example</h2>
<p>See <a href="/en-US/docs/Using_files_from_web_applications#Example.3A_Using_object_URLs_to_display_images" title="https://developer.mozilla.org/en/Using_files_from_web_applications#Example:_Using_object_URLs_to_display_images">Using object URLs to display images</a>.</p>
<h2 id="Notes" name="Notes">Notes</h2>
<p>Each time you call <code>createObjectURL()</code>, a new object URL is created, even if you've already created one for the same object. Each of these must be released by calling {{domxref("URL.revokeObjectURL()")}} when you no longer need them. Browsers will release these automatically when the document is unloaded; however, for optimal performance and memory usage, if there are safe times when you can explicitly unload them, you should do so.</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', '#dfn-createObjectURL', 'URL')}}</td>
      <td>{{Spec2('File API')}}</td>
      <td>Initial definition.</td>
    </tr>
  </tbody>
</table>
<h2 id="Browser_Compatibility" name="Browser_Compatibility">Browser compatibility</h2>
<p>{{CompatibilityTable}}</p>
<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>8 with <code>URL</code> prefixed as <code>webkitURL</code><br />
          {{CompatChrome(23)}}</td>
        <td>{{CompatGeckoDesktop(2)}}</td>
        <td>{{CompatIE(10)}}</td>
        <td>{{CompatOpera(15)}} with <code>URL</code> prefixed as <code>webkitURL</code></td>
        <td>{{CompatSafari(6)}} with <code>URL</code> prefixed as <code>webkitURL</code></td>
      </tr>
      <tr>
        <td>In a {{ domxref("Worker", "Web Worker") }}</td>
        <td>10 with <code>URL</code> prefixed as <code>webkitURL</code><br />
          {{CompatChrome(23)}}</td>
        <td>{{CompatGeckoDesktop(21)}}</td>
        <td>{{CompatIE(11)}}</td>
        <td>{{CompatOpera(15)}} with <code>URL</code> prefixed as <code>webkitURL</code></td>
        <td>{{CompatSafari(6)}} with <code>URL</code> prefixed as <code>webkitURL</code></td>
      </tr>
    </tbody>
  </table>
</div>
<div id="compat-mobile">
  <table class="compat-table" height="57" width="922">
    <tbody>
      <tr>
        <th>Feature</th>
        <th>Chrome for Android</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>18 with <code>URL</code> prefixed as <code>webkitURL</code></td>
        <td>4.0 with <code>URL</code> prefixed as <code>webkitURL</code></td>
        <td>{{CompatGeckoMobile(14)}}</td>
        <td>{{CompatUnknown}}</td>
        <td>{{CompatOpera(15)}} with <code>URL</code> prefixed as <code>webkitURL</code></td>
        <td>6.0 with <code>URL</code> prefixed as <code>webkitURL</code></td>
      </tr>
      <tr>
        <td>In a {{ domxref("Worker", "Web Worker") }}</td>
        <td>18 with <code>URL</code> prefixed as <code>webkitURL</code></td>
        <td>{{CompatVersionUnknown}} with <code>URL</code> prefixed as <code>webkitURL</code></td>
        <td>{{CompatGeckoMobile(14)}}</td>
        <td>{{CompatUnknown}}</td>
        <td>{{CompatOpera(15)}} with <code>URL</code> prefixed as <code>webkitURL</code></td>
        <td>6.0 with <code>URL</code> prefixed as <code>webkitURL</code></td>
      </tr>
    </tbody>
  </table>
</div>
<h2 id="See_also" name="See_also">See also</h2>
<ul>
  <li>{{domxref("URL.revokeObjectURL()")}}</li>
  <li><a href="/en-US/docs/Using_files_from_web_applications" title="Using files from web applications">Using files from web applications</a></li>
</ul>
Revert to this revision