前端 发票pdf格式,怎么显示到页面上?
时间: 2024-03-10 09:44:44 浏览: 8
您可以通过以下几种方法将发票PDF格式显示到前端页面上:
1. 使用iframe标签将PDF文件嵌入到HTML页面中:
```html
<iframe src="your_pdf_file.pdf" width="100%" height="600px"></iframe>
```
2. 使用<a>标签提供下载链接:
```html
<a href="your_pdf_file.pdf" target="_blank">下载发票</a>
```
3. 使用PDF.js库将PDF文件渲染成HTML格式:
```html
<div id="pdf-container"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.5.207/pdf.min.js"></script>
<script>
pdfjsLib.getDocument('your_pdf_file.pdf').promise.then(function(pdf) {
pdf.getPage(1).then(function(page) {
var canvas = document.createElement('canvas');
var context = canvas.getContext('2d');
canvas.height = 800;
canvas.width = 600;
page.render({canvasContext: context, viewport: page.getViewport({scale: 1})}).promise.then(function() {
document.querySelector('#pdf-container').appendChild(canvas);
});
});
});
</script>
```
以上是三种常见的将发票PDF格式显示到前端页面上的方法,您可以根据实际情况选择相应的方法。