javascriptajaxfile-uploadgoogle-closurefallback

Fallback AJAX file upload for Internet Explorer

I have implemented an AJAX file uploader in HTML5 using xHR2 and File api for an internal project. We were only required to support Firefox/Safari/Chrome. I used the following links as a reference

  1. http://www.html5rocks.com/en/tutorials/file/xhr2/
  2. http://www.html5rocks.com/en/tutorials/dnd/basics/
  3. https://developer.mozilla.org/en-US/docs/Using_files_from_web_applications

Now I am required to support Internet Explorer 10 and below. IE 10 supports XHR2 but File API support is lacking. Is there a way to detect that these APIs are not supported? If I can detect that the APIs are not supported, then how do I implement AJAX file upload for IE?

I am using Google Closure JS library not jQuery or any other library. The choice of library cannot be changed. Please use jQuery or some ones to that effect in the response. However, any code snippets that use jQuery are perfectly alright.

Solution

  • Recently I've been working on a file uploader to be used together with google closure library. I found the fine-uploader library a good start. It's not written with the closure library, but it provides me the basic guidelines: uses xhr to upload a file if supported, otherwise fallback to form post into a hidden iframe.

    In my code, I implemented two classes: one uses a XMLHttpRequest to upload a file, and the other use goog.net.IframeIo's sendFromForm method to upload a file.