前端页面展示本地PDF文件

Ⅰ 前端HTML页面转PDF（html2canvas+jspdf）

utils - htmlToPdf.js

main.js

1、如果在多个页面使用，给函数定义一个参数，参数为要导出页面部分的id。

将 '#pdfDom' 替换为参数即可
2、将导出文件的名称也作为参数传入函数

此种方式也可用于vue，尝试后可行，需要调节部分参数，但毕竟不太合适。
jQuery不需要调节。

https://github.com/zhangshaoliang/downLoadPDF

vue方式
jQuery方式

目前项目使用的是前端加后端方式，前端提供模板，echarts图表的话需要转为base64发送给后台。后台使用iText。目前存在的问题是后台不支持css3语法，只支持到css2，所以复杂的样式页面显示错乱，考虑个别页面使用纯前端实现。

网站导航

Ⅱ 怎么将pdf文件可以在网页上直接预览

选择用浏览器来打开目标PDF文件，即可实现在网页上直接预览PDF文件。

1、在电脑文件中，用鼠标右键目标PDF文件。

Ⅲ 如何直接在网页中显示PDF文件

只要客户端安装了adobe，只需给pdf的链接地址即可在客户端打开pdf文件。对于可识别的文件会在浏览器中直接打开。如果打不开的话，可以尝试调整一下浏览器设置或者换一下浏览器（如chrome，360等）。

Ⅳ pdf.js 如何预览本地文件

pdf.js预览文件必须只能是在服务器部署的项目路径下，不能通过修改配置的方式支持本地路径的版文件，否则会有js跨域问题权。如果要显示本地文件，可以折中考虑先做一个上传功能将文件上传到服务器上然后在页面上展示，这样基本实现了预览本地文件。

Ⅳ 如何实现springmvc将返回的给前端的pdf文件放在浏览器里预览

1，在web路径下建立一个uploadFiles文件夹。

2，在springMVC里映射文件就像映射静态文件那样。

<mvc:resources mapping="/pdf/**" location="/uploadFiles/"/>

3，写个controller返回PDF的URL路径。

@Controller
@CrossOrigin(origins = "*")
public class PDFController {

@ResponseBody
@RequestMapping(value = "/pdf", method = RequestMethod.GET)
public String pdfDownload() throws IOException
{
String retString = null;
String dir = XXXX文件在服务器中路径。
String path = httpServletRequest.getRequestURL() + dir.substring(dir.lastIndexOf('\'));
retString = path.replaceAll("\\","/");
Map<String,Object >map = new HashMap<>();
map.put("code",0);
map.put("pdf",retString);
return JSON.toJSONString(map);
}
}

4，返回的JSON数据。

{"code":0,"pdf":"8080/pdf/1472128890165sample.pdf"}，前面加上http://127.0.0.1:。

5,浏览器中直接打开pdf这个url就可以预览PDF啦。

Ⅵ 怎么实现前端HTML页面在线预览服务器传来的PDF和Word文件

首先我们想要实现在线浏览PDF文件，但是要知道想要将PDF文件进行在线浏览的话就只能使用一些在先浏览工具，我正好知道一个在线浏览网站挺不错的，使用起来很方便，小伙伴们可以自己去尝试这使用一下！

a.首先我们将浏览器进行打开，然后在网上搜索“迅捷PDF在线编辑”就可以搜索可以在先浏览的网站了

以上就是小编自己的看法，希望对小伙伴们有所帮助！

Ⅶ 怎么实现前端HTML页面在线预览服务器传来的PDF和Word文件

可以用flash显示。