用於Internet Explorer的后備AJAX文件上傳

Question

我已經針對內部項目使用xHR2和File api在HTML5中實現了AJAX文件上傳器。 我們只需要支持Firefox / Safari / Chrome。 我使用以下鏈接作為參考

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

現在，我需要支持Internet Explorer 10及更低版本。 IE 10支持XHR2，但缺少文件API支持。 有沒有辦法檢測不支持這些API？ 如果可以檢測到不支持這些API，那么如何實現IE的AJAX文件上傳？

我正在使用Google Closure JS庫而不是jQuery或任何其他庫。 庫的選擇無法更改。 請在響應中使用jQuery或其他實現該效果的工具。 但是，使用jQuery的任何代碼段都可以。

Answer 1

檢測File API是否存在的最簡單方法可能是

typeof File

在支持File API的瀏覽器中，它應該返回一個對象或函數-Internet Explorer返回undefined

關於如何回退並使其適用於所有用戶

我使用了此工具https://github.com/valums/ajax-upload ，該工具創建了一個iframe，並將上傳內容發布到iframe中，並模擬了AJAX文件上傳-其所有純javascript不需要庫，並且一直支持到IE6

Answer 2

最近，我一直在致力於與Google閉包庫一起使用的文件上傳器。 我發現優良上傳器庫是一個好的開始。 它不是用閉包庫編寫的，但是它為我提供了基本准則：使用xhr上載文件（如果支持），否則使用后備表單將其發布到隱藏的iframe中。

在我的代碼中，我實現了兩個類：一個使用XMLHttpRequest上傳文件，另一個使用goog.net.IframeIo的sendFromForm方法上傳文件。

Answer 3

看看Google Closure庫中的goog.net.iframeIo類。 這將從表單中獲取文件輸入元素，並將其發布到iFrame，即使在實際的XHR中也不會有AJAX體驗。

以下是有關如何實現Google文檔的鏈接：

https://code.google.com/p/closure-library/source/browse/closure/goog/net/iframeio.js#48