ajax请求后台下载文件

今天遇到一个需求，利用freemarker进行word导出。一般我们都是写好word模板，然后后台查询到所需要的数据，数据+模板=输出，利用freemarker提供的api进行word导出的。我这里有点不同是，数据来自其他的库，只是页面上面可以显示并且获取到（json格式的数据）。刚开始我做测试的时候，传的json串的长度比较短，然后用ajax的get请求就可以把数据传给后台，后台servlet就可以得到数据进行导出：

$.ajax({
	url: c2.base("service")+"dzzzExportWordServlet?param="+jsonString,
	async: false,
	type: "GET",
	success: function(data){
			debugger;
			console.log(data);
	 }
});

url：是我们工程中的写法，我们本地工程可以写成：localhost:8080/工程名/servlet访问路径

jsonString：这就是我们写死的一个短json串。

 

但是，当我把jsonString串的值写的比较长的时候，此时在用get请求就直接报错了。这是为什么呢？我们都知道，get请求是没有请求体的，他的参数是由长度限制的。所以这里用get请求显然不合适。于是我改成了post请求：

$.ajax({
	url: c2.base("service")+"dzzzExportWordServlet",
	async: false,
	type: "GET",
    data: {"param":jsonString},
	success: function(data){
			debugger;
			console.log(data);
	 }
});

jsonString示例如下：

var dataString ="{ " +
                "    \"base_info\":{ " +
                "        \"publish_org_id\":\"5c545a228a1f446da6b14f5a0663ffdf\", " +
                "        \"publish_org_name\":\"省人社厅\", " +
                "        \"runholder\":\"zdw1-17-02\", " +
                "        \"ec_no\":\"3342\", " +
                "        \"runholder_no\":\"221133199009087788\", " +
                "        \"catalog_id\":\"201801100001\", " +
                "        \"ec_name\":\"测试111\" " +
                "    }, " +
                "    \"extend_info\":[ " +
                "        { " +
                "            \"ec_type\":0, " +
                "            \"json_content\":{ " +
                "                \"yearNum\":\"20190413001\", " +
                "                \"area\":\"长沙市\", " +
                "                \"typeCode\":\"345454523434\", " +
                "                \"serialNumber\":\"09001\", " +
                "                \"4cvbaf17-5822-4060-vftt-4rt6924b4a2\":[ " +
                "                    { " +
                "                        \"name\":\"测量标准01\", " +
                "                        \"type\":\"1111111\", " +
                "                        \"measuringRange\":\"11~11.9\", " +
                "                        \"measurementError\":\"0.02\", " +
                "                        \"number\":\"111111-01\" " +
                "                    }, " +
                "                    { " +
                "                        \"name\":\"测量标准02\", " +
                "                        \"type\":\"22222222\", " +
                "                        \"measuringRange\":\"12~15.9\", " +
                "                        \"measurementError\":\"0.03\", " +
                "                        \"number\":\"22222-02\" " +
                "                    }, " +
                "                    { " +
                "                        \"name\":\"测量标准03\", " +
                "                        \"type\":\"33333333\", " +
                "                        \"measuringRange\":\"21~31.9\", " +
                "                        \"measurementError\":\"0.05\", " +
                "                        \"number\":\"33333-03\" " +
                "                    } " +
                "                ], " +
                "                \"534baf17-5822-4060-cfrr-4rt692vg567\":[ " +
                "                    { " +
                "                        \"name2\":\"主要设备01\", " +
                "                        \"type2\":\"sb-0001\", " +
                "                        \"measuringRange2\":\"100~199\", " +
                "                        \"measurementError2\":\"0.1\", " +
                "                        \"number2\":\"1111222\" " +
                "                    }, " +
                "                    { " +
                "                        \"name2\":\"主要设备02\", " +
                "                        \"type2\":\"sb-0002\", " +
                "                        \"measuringRange2\":\"200~299\", " +
                "                        \"measurementError2\":\"0.2\", " +
                "                        \"number2\":\"3333344\" " +
                "                    }, " +
                "                    { " +
                "                        \"name2\":\"主要设备03\", " +
                "                        \"type2\":\"sb-0003\", " +
                "                        \"measuringRange2\":\"300~399\", " +
                "                        \"measurementError2\":\"0.3\", " +
                "                        \"number2\":\"5555566\" " +
                "                    } " +
                "                ] " +
                "            } " +
                "        }, " +
                "        { " +
                "            \"ec_type\":1, " +
                "            \"json_content\":{ " +
                "                \"test4\":\"00\", " +
                "                \"fhzd\":\"\", " +
                "                \"test0\":\"66\", " +
                "                \"test1\":\"77\", " +
                "                \"test2\":\"88\", " +
                "                \"test3\":\"99\" " +
                "            } " +
                "        } " +
                "    ] " +
                "}";

这时传到后台的数据是可以正常接收到的。但是这还有一个问题，当我在后台进行导出文件，提供给客户下载的时候。freemarker生成的word文件确实已经保存在了本地，但是下载的方法中，向浏览器响应时，浏览器却没有得到任何响应，后台也不报错。这又是什么原因呢？后台问了别人，他说我的请求要改成form表单提交的方式，于是前台如下：

var url = c2.base("service")+"dzzzExportWordServlet";//请求的url
var form = $('<form method="POST" action="' + url + '"></from>');//定义一个form表单，进行post请求
$.each({"param":dataString}, function(k, v) {//循环遍历，把我们的每个参数封装到一个input框中
    var _input=$('<input/>',{type:"hidden",name:k});//定义一个input框 type为hidden,name为k
	_input.val(v);//设置input框的value值为v
	form.append(_input);//把input框添加到form表单
});
$('body').append(form);//把form表单添加的body
form.submit();//发起提交，请求url的后台
form.remove();//移除form

果然修改成上面的请求方式后，下载就正常了。

 

后来我自己还搭建了一个工程测试，发现我的这个jsonString可以通过get方式传到后台不会报错，不知道项目中怎么就报错了。当然我们最好还是选择post的请求方式，数据量可以传的大，更加安全。