在新的浏览器窗口的响应中显示PDF字节流 [英] Showing PDF bytestream in the response in a new browser window

问题描述

我正在尝试使用Javascript在新窗口中弹出PDF文件的字节流.

I am trying to popup a PDF file's byte stream in a new Window using Javascript.

在后端，我使用如下所示的Spring Controller代码

In the backend I am using a Spring Controller code as given below

@RequestMapping(value = "/print", method = RequestMethod.POST, consumes="application/json")
public ModelAndView printCompareChart(@RequestBody ChartGenerationRequest request,
        HttpServletRequest httpRequest ) throws Exception {

   byte [] bytes =//bytestream of a pdf file
   ModelAndView mav = new ModelAndView();
   mav.addObject("byteArray", bytes);
   mav.setViewName("pdfByteArrayPrint");
   return mav;
 }

此POST方法是通过JS这样的AJAX调用来调用的

This post method is called by an AJAX call from the JS like this

$.ajax({
    url: url,
    cache: false,
    type:'POST',
    data: JSON.stringify(data),
    contentType:"application/json; charset=UTF-8",
    success: function (responseData){
        var win=window.open('about:blank', target, windowProperties);
        with(win.document)
        {
          open();
          write(responseData);
          close();
        }
    }
});

从chrome开发人员工具中，我可以看到响应数据以字节为单位显示，但是在新的浏览器窗口中，它不显示实际的pdf文件，而是字节本身.

From the chrome developer tools I can see that the response data is coming up as bytes, but on the new browser window it doesn't show the actual pdf file, but the bytes itself.

这是我得到的输出

如何在此处显示从字节流中提取的实际文件?

How can I show the actual file here, extracted from the byte stream?

推荐答案

我根本无法正常工作.所以我想出了一个替代方案.从JS方面，我创建了一个隐藏的表单并提交了数据，后端以pdf字节流进行响应，然后将其显示在新的浏览器窗口中.在这种情况下，我不得不牺牲将json自动转换为java对象的功能，并分别从传递的httpRequest中处理每个参数.

I could not get this working at all. So I came up with an alternative to this. From the JS side I created a hidden form and submitted with data, the backend responded back with the pdf bytestream, which was then displayed on the new browser window. I had to sacrifice the automatic json conversion to java object in this case, and handle each parameters individually from the httpRequest passed.

JS代码

openWithPost = function(url, title, data, target) {

  var form = document.createElement("form");
  form.action = url;
  form.method = "POST";
  form.target = target || "_self";
  if (data) {
    for ( var key in data) {
        var input = document.createElement('input');
        input.type = 'hidden';
        input.name = key;
        input.value = data[key];
        form.appendChild(input);
    }
  }
  form.style.display = 'none';
  document.body.appendChild(form);
  form.submit();
}

后端Spring代码

@RequestMapping(value = "/printCompareChart", method = RequestMethod.POST)
public ModelAndView printCompareChart(HttpServletRequest httpRequest)
{
   //get each parameter from httpRequest and handle it
   String fileName = httpRequest.getParameter("fileName");
   //logic to create the pdf file
   byte[] bytes = //get bytes of the pdf file
   ModelAndView mav = new ModelAndView();
   mav.addObject("byteArray", bytes);
   mav.setViewName("pdfByteArrayPrint");
   return mav;
}

这篇关于在新的浏览器窗口的响应中显示PDF字节流的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！