vue+springboot pdf打印预览
程序员文章站
2024-01-20 08:44:22
pdf打印预览 1.下载pdfjs插件链接:http://mozilla.github.io/pdf.js/ 2.pdfjs插件引入项目中: ①本地运行可将pdfjs放入vue项目的static文件夹下(本项目放在/static/pdf/下) ②如果在linux服务器部署建议将pdfjs单独放一个文 ......
1.下载pdfjs插件链接:
2.pdfjs插件引入项目中:
①本地运行可将pdfjs放入vue项目的static文件夹下(本项目放在/static/pdf/下)
②如果在linux服务器部署建议将pdfjs单独放一个文件夹,打包可能引起访问路径的文件名发生变化,如果你有更好的方法,everything will be ok!
3.vue搞一搞
<el-button size="small" type="primary" @click="pdfprint()">打印预览</el-button> pdfprint() { this.$http({ //首先需要生成pdf文件 url: `/project/outpdf/exportpdf`, method: 'post', data: this.dataform }).then(({data}) => { if (data && data.code === 0) { let url = '' //根据本地和linux服务器pdf存放的位置进行配置 if (this.$http.base_url === 'http://127.0.0.1') { url = '/static/pdf/web/viewer.html?file=' } else { url = '/pdf/web/viewer.html?file=' } let pdfurl = encodeuricomponent(this.$http.base_url + `/project/outpdf/pdffilestream?token=${this.$cookie.get('token')}&filename=${filename}`) window.open(url + pdfurl) } }) }
4.后台返回文件流来一波
/** *返回文件流 **/ @requestmapping("/pdffilestream") public void pdfstreamhandeler(string filename,httpservletrequest request, httpservletresponse response) { try { string pdfpath = filepath + filename; file file = new file(pdfpath); byte [] data = null; fileinputstream inputstream = null; inputstream = new fileinputstream(file); data=new byte[inputstream.available()]; inputstream.read(data); response.getoutputstream().write(data); inputstream.close(); response.setheader("access-control-allow-origin", "*"); } catch (exception e) { e.printstacktrace(); } }
我踩过的坑希望大家都能跳过去~
推荐阅读
-
php在线预览word/rtf/pdf资料
-
vue+springboot pdf打印预览
-
php 实现打印预览的效能
-
请问:怎么将数据库中的内容导出为PDF文档后打印输出
-
vue 使用 vue-pdf 实现pdf在线预览的示例代码
-
Office文档上传后实时转换为PDF格式_图片文件上传后实时裁剪_实现在线预览Office文档
-
word转pdf 转swf 实现在线预览word文件功能
-
基于DevExpress的SpreadsheetControl实现对Excel的打开、预览、保存、另存为、打印(附源码下载)
-
Mac中怎么使用预览应用合并PDF文件 Mac预览应用合并PDF文件的技巧
-
Python使用reportlab将目录下所有的文本文件打印成pdf的方法