使用PDFObject嵌入Blob [英] Embed a Blob using PDFObject
本文介绍了使用PDFObject嵌入Blob的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正在使用: https://pdfobject.com/
在我的网络应用上显示嵌入的 pdf
文件。但是我无法渲染从 blob
创建的 pdf
。
To display an embedded pdf
file on my web app. However I cannot render a pdf
created from a blob
.
这是我试过的:
var arrayBufferView = new Uint8Array(response.Body.data);
var file = new Blob([arrayBufferView], {
type: response.ContentType
});
var url = window.URL.createObjectURL(file)
PDFObject.embed(url, "#my-container");
在html上获取此结果:
Gets me this result on html:
<div id="my-container" class="ng-scope pdfobject-container">
<embed class="pdfobject" src="blob:http%3A//localhost%3A4000/869a8d9a-7eaa-48dd-99aa-49bf299114aa" type="application/pdf" style="overflow: auto; width: 100%; height: 100%;" internalinstanceid="88">
</div>
然而,嵌入式容器在浏览器中不显示任何内容。我正在使用Chrome 51.0.2704.103 m
However the embed container displays nothing in my browser. I'm using Chrome 51.0.2704.103 m
推荐答案
尝试使用< iframe>
元素,请求资源为 Blob
Try using <iframe>
element, requesting resource as a Blob
html
<div id="my-container" class="ng-scope pdfobject-container">
<iframe src="" type="application/pdf" width="100%" height="100%" style="overflow: auto;">
</iframe>
</div>
javascript
javascript
var xhr = new XMLHttpRequest();
// load `document` from `cache`
xhr.open("GET", "/path/to/file.pdf", true);
xhr.responseType = "blob";
xhr.onload = function (e) {
if (this.status === 200) {
// `blob` response
console.log(this.response);
var file = window.URL.createObjectURL(this.response);
document.querySelector("iframe").src = file;
}
};
xhr.send();
plnkr http://plnkr.co/edit/9E5sGfMhUeIWV9yodAUd?p=preview
这篇关于使用PDFObject嵌入Blob的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文