POST方式下載文件,使用form代替ajax發送請求

參考鏈接:https://blog.csdn.net/wild46cat/article/details/52437554


需求說明:

前端請求後臺文件批量下載頁面表單html的pdf文件,之前採用的方式是先用ajax請求在服務器生成文件,然後通過鏈接訪問下載,這是兩次請求完成下載,但是項目使用了nginx實現負載均衡,所以兩次請求可能不會訪問同一個應用服務器,導致第二次請求無法訪問到第一次請求生成的文件,所以需要一次請求即可下載文件。

問題:

  1. 下載html轉成的pdf文件時,需要瀏覽器渲染,需要從前臺獲取到完整的html代碼,傳到後臺,涉及到很多數據,所以不能用get請求;
  2. ajax可以使用post請求,但是不會觸發瀏覽器下載文件的動作。

 解決方式:使用臨時form表單使用post方式提交消息

1. 創建函數

var DownLoadFile = function (options) {
        var config = $.extend(true, { method: 'post' }, options);
        var $iframe = $('<iframe id="down-file-iframe" enctype="multipart/form-data" />');
        var $form = $('<form target="down-file-iframe" method="' + config.method + '" />');
        $form.attr('action', config.url);
        for (var key in config.data) {
            $form.append('<input type="hidden" name="' + key + '" value="' + config.data[key] + '" />');
        }
        $iframe.append($form);
        $(document.body).append($iframe);
        $form[0].submit();
        $iframe.remove();
    };

2. 調用函數

var postData = {"file_ids":arrSelIDs,"form_html":arrSelHTMLs,"isarray":isArray,"basepath":basepath};
uiConfirm("您確定導出選中的公文附件?",function () {
         DownLoadFile({url:'BPMSyncAction.do?_funccode_=FileExportAttToZip',data:postData});
});

遇到問題及解決方式

  1. 由於input的value是html代碼字符串,導致後臺無法接收全部的html字符串,只能接受部分html代碼

         這裏採用了jquery.base64.js文件,講html字符串進行base64編碼,然後就可以傳輸了

 感謝大神,記錄一下

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