我有一个控制器,它将响应实体以PDF的字节数组形式发送给ajax调用。现在我想在浏览器中显示它,但什么都不起作用。我尝试了旧的stackoverflow问题中的每个建议,但没有任何作用。
这是来自Spring控制器的响应:
` %PDF-1.4
%����
6 0 obj
<</Filter/FlateDecode/Length 1983>>stream
x�� .......... [snip rest of the output]`
这是我的Ajax代码
$(".form").submit(function(e) {
var form = $(this);
var url = _contextPath + "pdf/" + id;
$.ajax({
type: "GET",
url: url,
data: form.serialize(),
datatype: "application/pdf",
success: function(data, textStatus, jqXHR)
{
console.log(data);
let pdfWindow = window.open("");
var bb = btoa(encodeURIComponent((data.replace(/[\u00A0-\u2666]/g, function(c) {
return '&#' + c.charCodeAt(0) + ';';
}))));
console.log(bb);
var file = new Blob([bb], {type:'application/pdf'});
console.log(file);
var fileUrl = URL.createObjectURL(file);
pdfWindow.document.write("<iframe width='100%' height='100%' src= '"+file+"'></iframe>");
/*var pdfData = btoa(unescape(encodeURIComponent(data)));
console.log(pdfData);
var pdfDataa = atob(pdfData);
console.log(pdfDataa);*/
/* var bb = btoa(encodeURIComponent((data.replace(/[\u00A0-\u2666]/g, function(c) {
return '&#' + c.charCodeAt(0) + ';';
}))));
console.log(bb);
var file = new Blob([bb], {type:'application/pdf'});
var fileUrl = URL.createObjectURL(file);
window.open(fileUrl,'', 'height=650,width=840');*/
//console.log(data);
// window.open("data:application/pdf;base64, " + data, '', 'height=650,width=840');
/*var blob = new Blob( [data], { type: "application/pdf" });
var fileURL = URL.createObjectURL(blob);
var win = window.open();
win.document.write('<iframe src="' + fileURL + '" frameborder="0"' +
' style="border:0; top:0px; left:0px; bottom:0px;' +
' right:0px; width:100%; height:100%;" allowfullscreen></iframe>')*/
/* var datauri = 'data:application/pdf;base64,' + Base64.encode(data);
var win = window.open();
win.document.write('<iframe src="' + datauri + '" frameborder="0"' +
' style="border:0; top:0px; left:0px; bottom:0px;' +
' right:0px; width:100%; height:100%;" allowfullscreen></iframe>');*/
//var base64EncodedStr = btoa(unescape(encodeURIComponent(data)));
//window.open(data,"_blank","scrollbars=yes,resizable=yes");
//window.open("data:application/pdf," + encodeURI(data));
// window.open("data:application/pdf," + escape(data));
//window.open("data:application/pdf," + base64EncodedStr);
// window.open("data:application/octet-stream;charset=utf-16le;base64,"+base64EncodedStr);
// let pdfWindow = window.open("")
// pdfWindow.document.write("<iframe width='100%' height='100%' src='data:application/pdf;base64, "
// + blob+"'></iframe>");
/* const byteArray = data;
const blob = new Blob([byteArray], {type: 'application/pdf'});
const blobURL = URL.createObjectURL(blob);
var win = window.open();
win.document.write('<iframe src="' + blobURL + '" frameborder="0"' +
' style="border:0; top:0px; left:0px; bottom:0px;' +
' right:0px; width:100%; height:100%;" allowfullscreen></iframe>');*/
/* var len = data.length;
var buffer = new ArrayBuffer(len);
var view = new Uint8Array(buffer);
for (var i = 0; i < len; i++) {
view[i] = binary.charCodeAt(i);
}
*/
/*var base64EncodedStr = btoa(unescape(encodeURIComponent(data.toString())));
var pdfData = base64EncodedStr;
var x = window.open();
var iframe = x.document.createElement('iframe')
iframe.width = '100%'
iframe.height = '100%'
iframe.frameBorder = 0
iframe.style = "border: 0"
iframe.src = "data:application/pdf;base64, " + pdfData
x.document.body.appendChild(iframe);*/
// $('.form').unbind('submit').submit();
}
});
e.preventDefault();
});
我尝试了一切但都没有成功。
<iframe id="frame"></iframe>
。然后在你的js中加入var url = _contextPath + "pdf/" + id; frame.src = url;
。或者更简单的方式是,如果url是静态的,可以使用<iframe url="#the_url#"></iframe>
。 - Kaiidotype
被设置为"GET"
呢?不管怎样,最简单的方法是直接将您的资源作为 Blob 获取(这意味着覆盖 jQuery 的 XHR 对象的responseType
,然后您只需要将 iframe 的 src 设置为URL.createObjectURL(XHR.response);
。 - Kaiido