YO

最近為了做多檔案非同步上傳的功能

找到了 Mini AJAX File Upload Form 這個 plugin

結果遇到在 android 2.x 的手機上無法使用的問題

沒想到在解決的過程中，問題一個接一個跑出來，android 瀏覽器的雷實在多的太可怕了

1. 首先，一般的 file input 是沒用的，一定要加上 capture="camera" 瀏覽器才會有反應，即 <input type="file" name="upl" capture="camera" />，這是開胃菜，只要補上去就行了。

2. 選了檔案之後，檔案的確有上傳到 server，但進度的數字卻一直卡在 0。調查了一下才發現，瀏覽器居然沒有設定檔案的 size，也就是 $('input[name=upl]')[0].files[0].size 值為 0，所以對進度的運算就完全失效了。我想得到的解決方法就只有判斷 $this[0].files[0].size 大於 0 時用進度表，否則就用一般 ajax loading 的 gif 圖檔。

3. 檔案確實傳上去了，但 ajax loading 的圖卻轉到天荒地老，完全不執行 done 這個 callback function，又試了好久才發現，原來是因為瀏覽器不支援 FormData 物件，無法使用一般的 $.ajax 方法來上傳檔案，必須用 iframe 的方法，而 plugin 不知是沒有實做監聽 iframe 內容還是有 bug，導致 callback 無效。最後乾脆自己實做一個 iframe ajax upload 的 plugin，https://github.com/anties/jquery.suckBrowserAjaxUpload，以 'undefined' === typeof FormData 來決定要套用 fileupload 或是 suckBrowserAjaxUpload。

4. 最後一個小雷也花了超久的時間才找到，就是 server 回傳的 json 格式資料怎麼樣就是不寫進 iframe 的 body 裡頭，搞了好久最後才發現是因為平常 server 的 php 程式在回傳 json 格式時，有加上 application/json 這個 header，但瀏覽器的 iframe 遇到這個 header 時就不把內容 render 到 body 裡，導致 iframe 內容都一片空白，所以必須把這個 header 拿掉。

也許對 android 2.x 的瀏覽器而言，這些 bug 都只是冰山一角，但也浪費了我好幾天的時間，真希望它們能早點跟 ie 一起消失。