Skip to content
Davit Barbakadze edited this page Nov 24, 2013 · 23 revisions

Plupload is multi-runtime file uploader. Keyword here is - multi-runtime. Which means that if one runtime fails to initialize, it will try another. The problem is that runtimes are not equally backed up with the same features. Flash for example has severe problems with chunking and accessing raw file data in general. Also it cannot trigger file dialog programmatically (just like Silverlight). Additionally, Flash and Silverlight have to operate in two modes and the actual set of capabilities depends on the mode that they've been initialized into. HTML4 is the most crippled of all - it can't chunk, it can't resize the images, it can't upload binary streams, it even can't report a progress.

In most cases you do not even need to know about those complexities, but if you are planning something fancy, like extracting ID3v2 tags from MP3 files on client-side or such, you will need a way to tell the Plupload about those capabilities that you'll require, otherwise it might choose a wrong runtime.

Plupload has a number of options that are supported in one runtime, but aren't - in another (see the feature table below). But when you request them in the config, by default, they do not affect the decision-making process in any way (there are exclusions to the rule however). Instead they are considered as recommendations, so that if a runtime that is selected in the end can fulfill them, it will fulfill them. Otherwise they will simply be ignored. This is done to achieve the ultimate purpose - to upload the file, whatever it takes.

Operational Modes

Currently there are two operational modes: browser and client. HTML runtimes (HTML5 and HTML4) operate in browser mode only, so additional mode is only for third party shims - Flash and Silverlight.

The whole necessity of introducing additional operational mode arose from the fact that features may be or may not be supported, depending on the way you initialize the runtime. In the table

<tr>
  <th width="174">Capability</th>
  <th width="331">Description</th>
  <td width="40"><sup>browser</sup></td>
  <td width="40"><sup>browser</sup></td>
  <td width="40"><sup>client</sup></td>
  <td width="40"><sup>browser</sup></td>
  <td width="40"><sup>client</sup></td>
  <td width="40"><sup>browser</sup></td>
</tr>
<tr>
  <td>
    <strong>
      access_binary
    </strong>
  </td>
  <td>
    <em>
      provide access to raw binary data of the file
    </em>
  </td>
  <td width="40">✔</td>
  <td width="40">✔ <sup><a href="#wiki-fn_1">[1]</a></sup></td>
  <td width="40">✘</td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✘ <sup><a href="#wiki-fn_8">[8]</a></sup></td>
</tr>
<tr>
  <td>
    <strong>
      access_image_binary
    </strong>
  </td>
  <td>
    <em>
      provide access to raw binary data of the image
    </em>
  </td>
  <td width="40">✔</td>
  <td width="40">✔ <sup><a href="#wiki-fn_1">[1]</a></sup></td>
  <td width="40">✘</td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✘ <sup><a href="#wiki-fn_8">[8]</a></sup></td>
</tr>
<tr>
  <td>
    <strong>
      display_media
    </strong>
  </td>
  <td>
    <em>
      display binary data as thumbs for example
    </em>
  </td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✘ <sup><a href="#wiki-fn_8">[8]</a></sup></td>
</tr>
<tr>
  <td>
    <strong>
      do_cors
    </strong>
  </td>
  <td>
    <em>
      make cross-domain requests
    </em>
  </td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✘</td>
</tr>
<tr>
  <td>
    <strong>
      drag_and_drop
    </strong>
  </td>
  <td>
    <em>
      accept files dragged and dropped from the desktop
    </em>
  </td>
  <td width="40">✔</td>
  <td width="40">✘</td>
  <td width="40">✘</td>
  <td width="40">✘</td>
  <td width="40">✘</td>
  <td width="40">✘</td>
</tr>
<tr>
  <td>
    <strong>
      filter_by_extension
    </strong>
  </td>
  <td>
    <em>
      filter files in selection dialog by their extensions
    </em>
  </td>
  <td width="40">✔ <sup><a href="#wiki-fn_7">[7]</a></sup></td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✔ <sup><a href="#wiki-fn_7">[7]</a></sup></td>
</tr>
<tr>
  <td>
    <strong>
      resize_image
    </strong>
  </td>
  <td>
    <em>
      resize image
    </em>
  </td>
  <td width="40">✔</td>
  <td width="40">✔ <sup><a href="#wiki-fn_1">[1]</a></sup></td>
  <td width="40">✘</td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✘</td>
</tr>
<tr>
  <td>
    <strong>
      report_upload_progress
    </strong>
  </td>
  <td>
    <em>
      periodically report how many bytes were uploaded
    </em>
  </td>
  <td width="40">✔</td>
  <td width="40">✔ <sup><a href="#wiki-fn_2">[2]</a></sup></td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✘</td>
</tr>
<tr>
  <td>
    <strong>
      return_response_headers
    </strong>
  </td>
  <td>
    <em>
      provide access to the headers of http response
    </em>
  </td>
  <td width="40">✔</td>
  <td width="40">✘</td>
  <td width="40">✘</td>
  <td width="40">✘</td>
  <td width="40">✔</td>
  <td width="40">✘</td>
</tr>
<tr>
  <td>
    <strong>
      return_response_type
    </strong>
  </td>
  <td>
    <em>
      support http response of specific type
    </em>
  </td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✔ <sup><a href="#wiki-fn_9">[9]</a></sup></td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✔ <sup><a href="#wiki-fn_9">[9]</a></sup></td>
</tr>
<tr>
  <td>
    <strong>
      return_status_code
    </strong>
  </td>
  <td>
    <em>
      return http status code of the response
    </em>
  </td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✔ <sup><a href="#wiki-fn_10">[10]</a></sup></td>
  <td width="40">✔ <sup><a href="#wiki-fn_10">[10]</a></sup></td>
  <td width="40">✔</td>
  <td width="40">✔ <sup><a href="#wiki-fn_10">[10]</a></sup></td>
</tr>
<tr>
  <td>
    <strong>
      send_custom_headers
    </strong>
  </td>
  <td>
    <em>
      send custom http header with the request
    </em>
  </td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✘</td>
  <td width="40">✘</td>
  <td width="40">✔</td>
  <td width="40">✔</td>
</tr>
<tr>
  <td>
    <strong>
      select_file
    </strong>
  </td>
  <td>
    <em>
      pick up a files from a dialog
    </em>
  </td>
  <td width="40">✔ <sup><a href="#wiki-fn_3">[3]</a></sup></td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✔</td>
</tr>
<tr>
  <td>
    <strong>
      select_folder
    </strong>
  </td>
  <td>
    <em>
      select a folder from a dialog
    </em>
  </td>
  <td width="40">✔ <sup><a href="#wiki-fn_3">[4]</a></sup></td>
  <td width="40">✘</td>
  <td width="40">✘</td>
  <td width="40">✘</td>
  <td width="40">✘</td>
  <td width="40">✘</td>
</tr>
<tr>
  <td>
    <strong>
      select_multiple
    </strong>
  </td>
  <td>
    <em>
      select multiple files at once from a file dialog
    </em>
  </td>
  <td width="40">✔ <sup><a href="#wiki-fn_4">[5]</a></sup></td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✘</td>
</tr>
<tr>
  <td>
    <strong>
      send_binary_string
    </strong>
  </td>
  <td>
    <em>
      send raw binary data (typically a binary string)
    </em>
  </td>
  <td width="40">✔</td>
  <td width="40">✔ <sup><a href="#wiki-fn_1">[1]</a></sup></td>
  <td width="40">✘</td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✘</td>
</tr>
<tr>
  <td>
    <strong>
      send_browser_cookies
    </strong>
  </td>
  <td>
    <em>
      send browser cookies with http request
    </em>
  </td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✘</td>
  <td width="40">✔</td>
  <td width="40">✘</td>
  <td width="40">✔</td>
</tr>
<tr>
  <td>
    <strong>
      send_multipart
    </strong>
  </td>
  <td>
    <em>
      send multipart/form-data
    </em>
  </td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✔</td>
</tr>
<tr>
  <td>
    <strong>
      slice_blob
    </strong>
  </td>
  <td>
    <em>
      slice the file or blob
    </em>
  </td>
  <td width="40">✔</td>
  <td width="40">✔ <sup><a href="#wiki-fn_1">[1]</a></sup></td>
  <td width="40">✘</td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✘</td>
</tr>
<tr>
  <td>
    <strong>
      stream_upload
    </strong>
  </td>
  <td>
    <em>
      upload file without preloading it to memory
    </em>
  </td>
  <td width="40">✔</td>
  <td width="40">✘</td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✔</td>
</tr>
<tr>
  <td>
    <strong>
      summon_file_dialog
    </strong>
  </td>
  <td>
    <em>
      programmatically trigger file dialog
    </em>
  </td>
  <td width="40">✔</td>
  <td width="40">✘</td>
  <td width="40">✘</td>
  <td width="40">✘</td>
  <td width="40">✘</td>
  <td width="40">✔ <sup><a href="#wiki-fn_6">[6]</a></sup></td>
</tr>
<tr>
  <td>
    <strong>
      upload_filesize
    </strong>
  </td>
  <td>
    <em>
      upload file of specific size
    </em>
  </td>
  <td width="40">✔</td>
  <td width="40">✔ <sup><a href="#wiki-fn_1">[1]</a></sup></td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✔</td>
  <td width="40">✔</td>
</tr>
  <tr>
  <td>
    <strong>use_http_method</strong></td>
  <td><em>use specific http method</em></td>
  <td width="40">✔</td>
  <td width="40">✔ <sup><a href="#wiki-fn_11">[11]</a></sup></td>
  <td width="40">✔ <sup><a href="#wiki-fn_11">[11]</a></sup></td>
  <td width="40">✔ <sup><a href="#wiki-fn_11">[11]</a></sup></td>
  <td width="40">✔</td>
  <td width="40">✔ <sup><a href="#wiki-fn_11">[11]</a></sup></td>
</tr>

Supported Features

1. Not effective on files over 200mb (the whole file should be preloaded in memory first).
2. Progress is estimated - browser mode in Flash has multiple benefits, and only two real drawbacks, although quite huge ones. The first one is [1] and second - inability to report upload progress, so we approximate it.
3. Seems essential, but not supported in iOS5 and less for example, so that upload is simply not possible there.
4. Only in Chrome 11+. It should be mentioned though that this feature requires separate file picker, since the same control cannot pick up files and folders simultaneously. It has to be one or the other.
5. In general this feature is available in every modern environment, but sometimes, usually due to unexpected bugs, it has to be disabled. Like in iOS and Safari on Windows.
6. IE can trigger file dialog programmatically but fails to upload selected file to an iframe, resulting into an Access Denied error.
7. Reliably files can be filtered only after selection. There are multiple problems with the file dialog.
8. Features are supported or unsupported depending on the environment, but in generally it is usually safer to assume them - unsupported.
9. Only text and document, and additionally - json (if window.JSON is defined).
10. Only 200 and 404.
11. Only GET and POST.

Clone this wiki locally