纯JS实现POST方式发送请求到java后台

在使用POI导出echarts统计报表的时候

1.前台请求后台最方便的请求方式是get,但get方式提交参数长度有限制,不适用于提交echarts统计图生成的图片信息。

var picBaseCode=myChart.getDataURL();

通过以上方法获取到echarts统计图的图片信息,picBaseCode是一段字符串类型的编码,内容超出了get提交的参数大小限制。

2.JQuery.Ajax以post形式提交请求

Ajax直接调用后台的下载方法是导出不了文件的,原因是Ajax请求只是个“字符型”的请求,即请求的内容是以文本类型存放的。文件的下载是以二进制形式进行的,ajax没法解析后台返回的文件流,所以无法处理二进制流response输出来下载文件,无法实现导出。

解决办法:纯JS实现POST方式发送请求到java后台

//导出Excel
function reportExcel(reportType,picBaseCode,unitNames,startDate,endDate,status,delayNum){
	var url=webCfg.servePath +"/reportForm/reportExcel";
    var params = {
    	"reportType":reportType,
    	"picBaseCode":picBaseCode,
    	"unitNames":encodeURI(unitNames),
    	"startDate":startDate,
    	"endDate":endDate,
    	"status":encodeURI(status),
    	"delayNum":encodeURI(delayNum)        
    };

    httpPost(url, params);
}

//发送POST请求跳转到指定页面
function httpPost(URL, PARAMS) {
    var temp = document.createElement("form");
    temp.action = URL;
    temp.method = "post";
    temp.style.display = "none";

    for (var x in PARAMS) {
        var opt = document.createElement("textarea");
        opt.name = x;
        opt.value = PARAMS[x];
        temp.appendChild(opt);
    }

    document.body.appendChild(temp);
    temp.submit();

    return temp;
}

这段代码就是通过虚拟表单的形式提交post请求,从而实现请求后台,最后又不影响Excel文件流返回页面。

参考资料:https://blog.csdn.net/shiyong1949/article/details/72471294

你可能感兴趣的:(js+css+htm,js提交post,poi导出echarts,获取图片编码)