乡下人产国偷v产偷v自拍,国产午夜片在线观看,婷婷成人亚洲综合国产麻豆,久久综合给合久久狠狠狠9

  • <output id="e9wm2"></output>
    <s id="e9wm2"><nobr id="e9wm2"><ins id="e9wm2"></ins></nobr></s>

    • 分享

      Webuploader 大文件分片上傳

       ThinkTank_引擎 2016-01-16

        前陣子要做個(gè)大文件上傳的功能,找來(lái)找去發(fā)現(xiàn)Webuploader還不錯(cuò),關(guān)于她的介紹我就不再贅述。

        動(dòng)手前,在園子里找到了一篇不錯(cuò)的分片上傳的帖子,參考之后,踏出了第一步。此文記錄我這次實(shí)踐的點(diǎn)滴,僅作分享與討論。

        

        關(guān)于插件的使用可以參考快速使用文檔。在Github上下載了最新的壓縮包后,基于其中的一個(gè)例子(image-upload)做了修改,主要是補(bǔ)充了.net后臺(tái)分片接收文件的實(shí)現(xiàn)。

        先上干貨:WebUploadTest.zip  提取碼:fikn

        

         分片上傳的上傳邏輯已經(jīng)有控件實(shí)現(xiàn)。保存分片的邏輯是:

      每次上傳文件,用js生成一個(gè)guid。請(qǐng)看upload.js 87行

      GUID = WebUploader.Base.guid()

      webuploader配置參數(shù)時(shí)會(huì)用到上面的guid。上傳并發(fā)數(shù)自己改吧,>1經(jīng)過(guò)測(cè)試貌似也可以(我一開(kāi)始用其他代碼測(cè)試時(shí)>1有報(bào)錯(cuò)過(guò),如有出錯(cuò)留作討論)

      后臺(tái)根據(jù)前端的guid,生成一個(gè)臨時(shí)文件夾,文件夾的用guid的值命名。然后分片文件以當(dāng)前分片序數(shù)命名,保存在臨時(shí)文件夾。fileupload.ashx 24行

       

      復(fù)制代碼
      復(fù)制代碼
      
      

      //取得chunk和chunks
      int chunk = Convert.ToInt32(context.Request.Form["chunk"]);//當(dāng)前分片在上傳分片中的順序(從0開(kāi)始)
      int chunks = Convert.ToInt32(context.Request.Form["chunks"]);//總分片數(shù)
      //根據(jù)GUID創(chuàng)建用該GUID命名的臨時(shí)文件夾
      string folder = context.Server.MapPath("~/1/" + context.Request["guid"]+"/");
      string path = folder + chunk;//每個(gè)分片用數(shù)字命名

      復(fù)制代碼
      復(fù)制代碼

      后臺(tái)每次返回一個(gè)json字符串。關(guān)于這個(gè)返回值是可以像構(gòu)造ajax返回參數(shù)一樣自定義的。我是這樣返回與接收的。請(qǐng)看fileupload.ashx 57行起

      復(fù)制代碼
      復(fù)制代碼
                   //...
               context.Response.Write("{\"chunked\" : true, \"hasError\" : false, \"f_ext\" : \"" + Path.GetExtension(file.FileName) + "\"}"); } else//沒(méi)有分片直接保存 { context.Request.Files[0].SaveAs(context.Server.MapPath("~/1/" + DateTime.Now.ToFileTime() + Path.GetExtension(context.Request.Files[0].FileName))); context.Response.Write("{\"chunked\" : false, \"hasError\" : false}"); }
              //...
      復(fù)制代碼
      復(fù)制代碼

      接收的js如下:upload.js 544行

      復(fù)制代碼
      復(fù)制代碼
              // 文件上傳成功,合并文件。
              uploader.on('uploadSuccess', function (file, response) {
                  if (response.chunked) {
                      $.post("MergeFiles.ashx", { guid: GUID, fileExt: response.f_ext },
                      function (data) {
                          data = $.parseJSON(data);
                          if (data.hasError) {
                              alert('文件合并失??!');
                          } else {
                              alert(decodeURIComponent(data.savePath));
                          }
                      });
                  }
              });
      復(fù)制代碼
      復(fù)制代碼

      由于上傳時(shí),文件分片保存于以guid的值命名的文件夾中,所有,在單個(gè)文件全部上傳完畢之后,再發(fā)送一個(gè)異步請(qǐng)求到 MergeFiles.ashx 合并文件,合并是將臨時(shí)文件夾里的文件按文件名順序合并(文件名是數(shù)字)。

       

      運(yùn)行本代碼,在瀏覽器控制臺(tái)可以觀察插件上傳文件的各個(gè)事件。

       

      webuploader支持?jǐn)帱c(diǎn)續(xù)傳,但是由于官網(wǎng)例子的原因,我這個(gè)例子上的斷點(diǎn)是不能停止的,這里容我把樂(lè)趣留給大家。webuploader官網(wǎng)api有答案,改起來(lái)挺簡(jiǎn)單的。呵呵

       

        本站是提供個(gè)人知識(shí)管理的網(wǎng)絡(luò)存儲(chǔ)空間,所有內(nèi)容均由用戶發(fā)布,不代表本站觀點(diǎn)。請(qǐng)注意甄別內(nèi)容中的聯(lián)系方式、誘導(dǎo)購(gòu)買等信息,謹(jǐn)防詐騙。如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容,請(qǐng)點(diǎn)擊一鍵舉報(bào)。
        轉(zhuǎn)藏 分享 獻(xiàn)花(0

        0條評(píng)論

        發(fā)表

        請(qǐng)遵守用戶 評(píng)論公約

        類似文章 更多