js监听下载文件是否准备好

方法一:使用cookie

前台:

<a onclick="down()" href="javascript:void(0)" id="aa">点击下载</a>

<script type="text/javascript">
      function down() {
        try {
            var downloadToken = +new Date();
            var url = "export.do?downloadToken=" + downloadToken;
            load();
            location.href = url;
            function checkToken() {
                var token = getCookie("downloadToken");
                if (token && token == downloadToken) {
                    clearTimeout(downloadTimer);
                    disLoad();
                }
            }
            var downloadTimer = setInterval(checkToken, 1000);
        } catch (e) {
            alert(e.name + ": " + e.message);
        }
 }
        //弹出加载层
        function load() {
            $("<div class=\"datagrid-mask\"></div>").css({ display: "block", width: "100%", height: $(window).height() }).appendTo("body");
            $("<div class=\"datagrid-mask-msg\"></div>").html("数据加载中,请稍后....").appendTo("body").css({ display: "block", left: ($(document.body).outerWidth(true) - 190) / 2, top: ($(window).height() - 45) / 2 });
        }
        //取消加载层
        function disLoad() {
            $(".datagrid-mask").remove();
            $(".datagrid-mask-msg").remove();
        }


        function getCookie(cookieName) {
            var strCookie = document.cookie;
            var arrCookie = strCookie.split("; ");
            for(var i = 0; i < arrCookie.length; i++){
                var arr = arrCookie[i].split("=");
                if(cookieName == arr[0]){
                    return arr[1];
                }
            }
            return "";
        }
</script>

后台:

  Cookie cookie = new Cookie(name, value);
  cookie.setPath("/");
  cookie.setMaxAge("-1");
  response.addCookie(cookie);


方法二:使用XmlHttlRequest

前台:

 function loadDown() {
        load();
        var downloadToken = +new Date();
        var url = "export.do?downloadToken=" + downloadToken;
        var xhr = new XMLHttpRequest();
        xhr.open('GET', url, true);    // 也可以使用POST方式,根据接口
        xhr.responseType = "blob";    
        xhr.onload = function () {
            if (this.status === 200) {
                var blob = this.response;
                var reader = new FileReader();
                reader.readAsDataURL(blob);    
                reader.onload = function (e) {
                    disLoad();
                    var headerName = xhr.getResponseHeader("Content-disposition");
                    var fileName = decodeURIComponent(headerName).substring(20);
                    alert(fileName);
                    var a = document.createElement('a');
                    a.download = fileName;
                    a.href = e.target.result;
                    $("body").append(a);    // 修复firefox中无法触发click
                    a.click();
                    $(a).remove();
                }
            }
        };
        xhr.send()

    }

后台:

response.setHeader("Content-Disposition", "attachment;filename=" + URLEncoder.encode(filename,"UTF-8"));

阅读更多
想对作者说点什么?

博主推荐

换一批

没有更多推荐了,返回首页