mozilla

Revision 264625 of BlobBuilder

  • Revision slug: DOM/BlobBuilder
  • Revision title: BlobBuilder
  • Revision id: 264625
  • Created:
  • Creator: FredB
  • Is current revision? No
  • Comment

Revision Content

{{ deprecated_header() }}

{{ SeeCompatTable() }}

The BlobBuilder interface provides an easy way to construct {{ domxref("Blob") }} objects. Just create a BlobBuilder and append chunks of data to it by calling the {{ manch("append") }} method. When you're done building your blob, call {{ manch("getBlob") }} to retrieve a {{ domxref("Blob") }} containing the data you sent into the blob builder.

Note: The BlobBuilder interface has been deprecated in favor of the newly introduced {{ domxref('Blob') }} constructor.

Method overview

void append(in ArrayBuffer data);
void append(in Blob data);
void append(in String data, [optional] in String endings);
Blob getBlob([optional] in DOMString contentType);
File getFile(in DOMString name, [optional] in DOMString contentType);

Methods

append()

Appends the contents of the specified JavaScript object to the {{ domxref("Blob") }} being built. If the value you specify isn't a {{ domxref("Blob") }}, ArrayBuffer, or String, the value is coerced to a string before being appended to the blob.

void append(
  in ArrayBuffer data
};

void append(
  in Blob data
};


void append(
  in String data,
  [optional] in String endings
};
Parameters
data
The data to append to the {{ domxref("Blob") }} being constructed.
endings
Specifies how strings containing \n are to be written out. This can be "transparent" (endings unchanged) or "native" (endings changed to match host OS filesystem convention). The default value is "transparent".

getBlob()

Returns the {{ domxref("Blob") }} object that has been constructed using the data passed through calls to {{ manch("append") }}.

Blob getBlob(
  in DOMString contentType {{ optional_inline() }}
);
Parameters
contentType {{ optional_inline() }}
The MIME type of the data to be returned in the {{ domxref("Blob") }}. This will be the value of the Blob object's type property.
Return value

A {{ domxref("Blob") }} object containing all of the data passed to any calls to {{ manch("append") }} made since the BlobBuilder was created. This also resets the BlobBuilder so that the next call to {{ manch("append") }} is starting a new, empty blob.

getFile() {{ non-standard_inline() }}

Returns a {{ domxref("File") }} object.

File getFile(
  in DOMString name,
  [optional] in DOMString contentType
); 
Parameters
name
The file name.
contentType {{ optional_inline() }}
The MIME type of the data to be returned in the {{ domxref("File") }}. This will be the value of the File object's type property.
Return value

A {{ domxref("File") }} object.

Browser compatibility

{{ CompatibilityTable() }}

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support 8
As WebKitBlobBuilder
{{ CompatGeckoDesktop("6.0") }}
As MozBlobBuilder
10
As MSBlobBuilder
{{ CompatNo() }} {{ CompatNo() }}†
getfile() {{ non-standard_inline() }} {{ CompatNo() }} {{ CompatGeckoDesktop("8.0") }} {{ CompatNo() }} {{ CompatNo() }} {{ CompatNo() }}
Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support 3
As WebKitBlobBuilder
{{ CompatGeckoMobile("6.0") }}
As MozBlobBuilder
{{ CompatNo() }} {{ CompatNo() }} {{ CompatNo() }}
getfile() {{ non-standard_inline() }} {{ CompatNo() }} {{ CompatGeckoMobile("8.0") }} {{ CompatNo() }} {{ CompatNo() }} {{ CompatNo() }}

Notes on BlobBuilder deprecation

  • Starting in Firefox 14, using MozBlobBuilder will show a warning message in Web Console that the use of MozBlobBuilder is deprecated and use {{ domxref("Blob") }} constructor instead.
  • WebKit has deprecated WebKitBlobBuilder and has made its support configurable. Currently Safari disables the feature in Nightly, so it will never likely to ship in the final version. On the other hand, Chrome, which has supported it since Chrome 8, still enables the feature. So Chrome might continue to support the feature. (See this WebKit changeset for details).

See also

  • {{ spec("http://dev.w3.org/2009/dap/file-system/file-writer.html#idl-def-BlobBuilder", "File API Specification: BlobBuilder", "ED") }}
  • {{ domxref("Blob") }}
  • {{ domxref("File") }}

Revision Source

<p>{{ deprecated_header() }}</p>
<p>{{ SeeCompatTable() }}</p>
<p>The <code>BlobBuilder</code> interface provides an easy way to construct {{ domxref("Blob") }} objects. Just create a <code>BlobBuilder</code> and append chunks of data to it by calling the {{ manch("append") }} method. When you're done building your blob, call {{ manch("getBlob") }} to retrieve a {{ domxref("Blob") }} containing the data you sent into the blob builder.</p>
<div class="note">
  <strong>Note:</strong> The <code>BlobBuilder</code> interface has been deprecated in favor of the newly introduced {{ domxref('Blob') }} constructor.</div>
<h2 id="Method_overview" name="Method_overview">Method overview</h2>
<table class="standard-table">
  <tbody>
    <tr>
      <td><code>void <a href="/en/DOM/BlobBuilder#append()" title="en/DOM/BlobBuilder#append()">append</a>(in ArrayBuffer data);</code></td>
    </tr>
    <tr>
      <td><code>void <a href="/en/DOM/BlobBuilder#append()" title="en/DOM/BlobBuilder#append()">append</a>(in Blob data);</code></td>
    </tr>
    <tr>
      <td><code>void <a href="/en/DOM/BlobBuilder#append()" title="en/DOM/BlobBuilder#append()">append</a>(in String data, [optional] in String endings);</code></td>
    </tr>
    <tr>
      <td><code>Blob <a href="/en/DOM/BlobBuilder#getBlob()" title="en/DOM/BlobBuilder#getBlob()">getBlob</a>([optional] in DOMString contentType);</code></td>
    </tr>
    <tr>
      <td><code>File <a href="/en/DOM/BlobBuilder#getFile()" title="en/DOM/BlobBuilder#getFile()">getFile</a>(in DOMString name, [optional] in DOMString contentType);</code></td>
    </tr>
  </tbody>
</table>
<h2 id="Methods">Methods</h2>
<h3 id="append()">append()</h3>
<p>Appends the contents of the specified JavaScript object to the {{ domxref("Blob") }} being built. If the value you specify isn't a {{ domxref("Blob") }}, <a href="/en/JavaScript_typed_arrays/ArrayBuffer" title="en/JavaScript typed arrays/Arraybuffer"><code>ArrayBuffer</code></a>, or <a href="/en/JavaScript/Reference/Global_Objects/String" title="en/JavaScript/Reference/Global Objects/String"><code>String</code></a>, the value is coerced to a string before being appended to the blob.</p>
<pre>void append(
  in ArrayBuffer data
};

void append(
  in Blob data
};


void append(
  in String data,
  [optional] in String endings
};
</pre>
<h6 id="Parameters">Parameters</h6>
<dl>
  <dt>
    <code>data</code></dt>
  <dd>
    The data to append to the {{ domxref("Blob") }} being constructed.</dd>
  <dt>
    <code>endings</code></dt>
  <dd>
    Specifies how strings containing <code>\n</code> are to be written out. This can be <code>"transparent"</code> (endings unchanged) or <code>"native"</code> (endings changed to match host OS filesystem convention). The default value is <code>"transparent"</code>.</dd>
</dl>
<h3 id="getBlob()">getBlob()</h3>
<p>Returns the {{ domxref("Blob") }} object that has been constructed using the data passed through calls to {{ manch("append") }}.</p>
<pre class="eval">Blob getBlob(
  in DOMString contentType {{ optional_inline() }}
);
</pre>
<h6 id="Parameters">Parameters</h6>
<dl>
  <dt>
    contentType {{ optional_inline() }}</dt>
  <dd>
    The MIME type of the data to be returned in the {{ domxref("Blob") }}. This will be the value of the <code>Blob</code> object's type property.</dd>
</dl>
<h6 id="Return_value">Return value</h6>
<p>A {{ domxref("Blob") }} object containing all of the data passed to any calls to {{ manch("append") }} made since the <code>BlobBuilder</code> was created. This also resets the <code>BlobBuilder</code> so that the next call to {{ manch("append") }} is starting a new, empty blob.</p>
<h3 id="getFile()_{{_non-standard_inline()_}}">getFile() {{ non-standard_inline() }}</h3>
<p>Returns a {{ domxref("File") }} object.</p>
<pre class="eval">File getFile(
  in DOMString name,
  [optional] in DOMString contentType
); 
</pre>
<h6 id="Parameters">Parameters</h6>
<dl>
  <dt>
    name</dt>
  <dd>
    The file name.</dd>
  <dt>
    contentType {{ optional_inline() }}</dt>
  <dd>
    The MIME type of the data to be returned in the {{ domxref("File") }}. This will be the value of the <code>File</code> object's type property.</dd>
</dl>
<h6 id="Return_value">Return value</h6>
<p>A {{ domxref("File") }} object.</p>
<h2 id="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</th>
      </tr>
      <tr>
        <td>Basic support</td>
        <td>8<br>
          As <code>WebKitBlobBuilder</code> †</td>
        <td>{{ CompatGeckoDesktop("6.0") }}<br>
          As <code>MozBlobBuilder</code></td>
        <td>10<br>
          As <code>MSBlobBuilder</code></td>
        <td>{{ CompatNo() }}</td>
        <td>{{ CompatNo() }}†</td>
      </tr>
      <tr>
        <td><code>getfile()</code> {{ non-standard_inline() }}</td>
        <td>{{ CompatNo() }}</td>
        <td>{{ CompatGeckoDesktop("8.0") }}</td>
        <td>{{ CompatNo() }}</td>
        <td>{{ CompatNo() }}</td>
        <td>{{ CompatNo() }}</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 Mobile</th>
        <th>Opera Mobile</th>
        <th>Safari Mobile</th>
      </tr>
      <tr>
        <td>Basic support</td>
        <td>3<br>
          As <code>WebKitBlobBuilder</code></td>
        <td>{{ CompatGeckoMobile("6.0") }}<br>
          As <code>MozBlobBuilder</code></td>
        <td>{{ CompatNo() }}</td>
        <td>{{ CompatNo() }}</td>
        <td>{{ CompatNo() }}</td>
      </tr>
      <tr>
        <td><code>getfile()</code> {{ non-standard_inline() }}</td>
        <td>{{ CompatNo() }}</td>
        <td>{{ CompatGeckoMobile("8.0") }}</td>
        <td>{{ CompatNo() }}</td>
        <td>{{ CompatNo() }}</td>
        <td>{{ CompatNo() }}</td>
      </tr>
    </tbody>
  </table>
</div>
<h3 id="Notes_on_BlobBuilder_deprecation">Notes on BlobBuilder deprecation</h3>
<ul>
  <li>Starting in Firefox 14, using <code>MozBlobBuilder</code> will show a warning message in Web Console that the use of <code>MozBlobBuilder</code> is deprecated and use {{ domxref("Blob") }} constructor instead.</li>
  <li>WebKit has deprecated <code>WebKitBlobBuilder</code> and has made its support configurable. Currently Safari disables the feature in Nightly, so it will never likely to ship in the final version. On the other hand, Chrome, which has supported it since Chrome 8, still enables the feature. So Chrome might continue to support the feature. (See this <a class="external" href="http://trac.webkit.org/changeset/115666" title="http://trac.webkit.org/changeset/115666">WebKit changeset</a> for details).</li>
</ul>
<h2 id="See_also">See also</h2>
<ul>
  <li>{{ spec("http://dev.w3.org/2009/dap/file-system/file-writer.html#idl-def-BlobBuilder", "File API Specification: BlobBuilder", "ED") }}</li>
  <li>{{ domxref("Blob") }}</li>
  <li>{{ domxref("File") }}</li>
</ul>
Revert to this revision