File Upload Support On Mobile

I were quite surprised few weeks ago when I found out with Matt, my colleague, that no one has tested thoroughly which mobile browsers support input type=file and how to reliably detect the support. After an hour of Googling we literally gave up and decided to find it out ourselves. The results are shared here to everyone for future reference.

For the detection part, I am using similar code as Modernizr does, but I’ve added a separate user agent regexp to check against browsers that falsely report support. There are quite many of those false positives really, at least all Windows Phone devices running OS 7.0-8.0, Android devices running OS 1.0-2.2, Kindle devices running OS 1.0-3.0 and all WebOS devices running OS 1.0-3.0.5 (Although the latter ones being quite old already).

Testing #

For the testing part, I used this page which was loaded on to all devices in our device lab. Thanks to David Blooman, Juha Ristolainen and Mike Arvela, I were able to test this on older Blackberry devices, Windows RT tablet and on Windows Phone 8 too. Below is the JS part used for the detection, which can also be found from GitHub:

// Detect file input support
var isFileInputSupported = (function () {
// Handle devices which falsely report support
if (navigator.userAgent.match(/(Android (1.0|1.1|1.5|1.6|2.0|2.1))|(Windows Phone (OS 7|8.0))|(XBLWP)|(ZuneWP)|(w(eb)?OSBrowser)|(webOS)|(Kindle\/(1.0|2.0|2.5|3.0))/)) {
return false;
}
// Create test element
var el = document.createElement("input");
el.type = "file";
return !el.disabled;
})();

// Add 'fileinput' class to html element if supported
if (isFileInputSupported) {
document.documentElement.className += " fileinput";
}

Additionally, I tested manually on every device that the uploading actually works, and for that I used just basic html form:

<form action="http://www.tipjar.com/cgi-bin/test" enctype="multipart/form-data" method="post">
<input type="file" name="image">
<input type="submit" value="Upload">
</form>

Test Results #

OSWorks
Android 1.0–2.1No
Android 2.2+Yes
Blackberry 1.0–5.0No
Blackberry 6.0+Yes
Blackberry Tablet 2.0+Yes
Firefox OS 1.0No
iOS 1.0–5.1.1No
iOS 6.0–7.1.2Yes
iOS 8.0No
iOS 8.0.2+Yes
Kindle 1.0–3.0No
Maemo 5.0+Yes
Meego 1.2+Yes
Symbian 9.1–10.1Yes
WebOS 1.0–3.0.5No
Windows Phone 7.0–8.0No
Windows Phone 8.1Yes
Windows RTYes

Notes #

  • Android devices which are running OS2.1 and under still support file uploads through Opera Mobile and Opera Mini, but not through the default Webkit based browser.
  • Amazon Kindle Keyboard reports that it support file uploads, but when you click the “browse” button, the device displays an alert box saying “file uploads not supported.”
  • On older Windows Phone OS the file input shows up, but doesn’t respond to touch at all or give any kind of feedback that it isn’t supported.

Conclusion #

The support is actually quite good nowadays, Windows Phone OS and older iOS being the biggest drawbacks. I were also quite surprised to notice that even our oldest Symbian devices from around 2004 supported file uploads. Also, with almost all of the test devices, if the upload worked on the default browser, it also worked on other browsers like Firefox Mobile and Opera Mobile/Mini too. ❦

Update 8 Jan 2013: False positives on Modernizr are now fixed and it's using the same UA detection introduced in this post!

Update 28 Apr 2014: Windows Phone 8.1 added.

Share