網頁實現文件打包下載

                                    網頁實現文件打包下載

前段時間收到需要批量下載文件的需求。一開始是做一個把所有需要下載的文件複製到粘貼板這樣就可以去迅雷或者其他下載軟件批量下載,但是這樣還是不能滿足用戶的需求。

用戶希望一點擊就把所有需要下載的文件壓縮成一個包後只需下載一次即可。這樣整個功能就需要重新更改了。

於是思路改成用戶在選擇需要下載的文件之後由前端把所有需要下載的連接發送至後端,後端接收到請求後,在把所有文件壓縮並生成一個壓縮包,存放到臨時目錄後把目錄連接在回傳給前端即可以下載。 

前端用jquery先獲取所有勾選的行,並且拿到選中行對應要下載的文件連接,存放到一個數組裏面。再用ajax異步發送數組到後端。

前端代碼:

 $.ajax({
            url: "/Home/GetPackageDownLink",  //後端接口地址
            data: { DownLinkList: JSON.stringify(copyConten) }, //把需要發送的文件連接轉爲json數組
            type: "post",
            dataType: "json",
            success: function (data) {
                if (data.code == 1) {
                    var link = document.createElement('a');//創建一個a標籤,用來模擬點擊下載
                    link.href = data.message;//message是後端傳回來的下載地址
                    var reportNo = GetSelectFirstReportNo();//獲取第一個文件名,用來更改下載的文件名
                    link.setAttribute("download", reportNo + "等報告書打包文件");//更改文件夾
                    link.click();//彈出下載
                }
            }
        });

後端關鍵代碼:(這裏是用c#,當然可以用其他語言實現。)

 var finalTarget = Path.Combine(targetDire, newNo + ".zip");//生成存放打包文件的目錄
                //壓縮文件
                ZipFiles(newDownLinkList, finalTarget, null);//newDownLinkList爲需要下載的連接
                result = TargetFileName;  //打包完成後返回打包文件的連接地址

這裏還有一點不完美就是改不了 下載的文件名待後面解決。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章