最近使用jQuery.Uploadify和Web API配合來做上傳,碰到問題,還木有辦法解決,記錄一下:
環境:jQuery 1.10.2,Uploadify 3.2.1,SWFObject 2.2,Web API 2
前端相關代碼(JavaScript):
$("#file-upload").uploadify({
"auto": false,
"multi": false,
"buttonText": "請選擇文件",
"swf": "/upload.swf",
"uploader": "/api/up",
"uploadLimit": 1,
"removeCompleted": false,
"onSelect": function (file) {
$("#btn-upload").prop("disabled", false);
},
"onCancel": function (file) {
$("#btn-upload").prop("disabled", true);
},
"onUploadStart": function (file) {
alert("開始上傳:" + file.name);
},
"onUploadSuccess": function (file, data, response) {
alert("上傳[" + file.name + "]成功");
},
"onUploadError": function (file, errorCode, errorMsg, errorString) {
alert("上傳[" + file.name + "]失敗");
}
});
服務端相關代碼(C#)
接收文件的ApiController:
using System; using System.IO; using System.Net.Http; using System.Net.Http.Headers; using System.Text; using System.Threading.Tasks; using System.Web; using System.Web.Http;
[HttpPost] public async Task<bool> UploadFile() { if (!Request.Content.IsMimeMultipartContent("form-data")) { return false; } var root = HttpContext.Current.Server.MapPath("~/upload/temp"); var provider = new CustomMultipartFormDataStreamProvider(root); var body = await Request.Content.ReadAsMultipartAsync(provider); var result = body.FileData[0].LocalFileName; return true; }
新建一個CustomMultipartFormDataStreamProvider類,繼承自MultipartFormDataStreamProvider,用於還原上傳的文件名:
public class CustomMultipartFormDataStreamProvider : MultipartFormDataStreamProvider { public CustomMultipartFormDataStreamProvider(string path) : base(path) { } public override string GetLocalFileName(HttpContentHeaders headers) { var sb = new StringBuilder((headers.ContentDisposition.FileName ?? DateTime.Now.Ticks.ToString()).Replace("\"", "").Trim().Replace(" ", "_")); Array.ForEach(Path.GetInvalidFileNameChars(), invalidChar => sb.Replace(invalidChar, '-')); return sb.ToString(); } }
上面的代碼完成后,能夠順利跑起來,測試了一下,文件已經成功上傳到服務器,但是,上傳結果始終顯示失敗,一直報錯:Error writing MIME multipart body part to output stream.
這下可奇怪了,Google了半天,找到了相關的說明,原來是Web API 2 Framework的Bug,和Flash的換行符有關,一方面,等待MS修復(MS已經在修復了,預計在Web API 2.1里面將修復),另外一個方面,應該可以通過其他方式來解決,不管了,先記錄下來,等解決了,再完成本文。
以下是國外的網友討論和MS相關的說明,全部系英文,感興趣的園友可以去看看。
國外網友討論(英文)
MS開發團隊說明(英文)
MS開發團隊的另一個說明(英文)
