html在线预览pdf，显示图片，隐藏下载

仗剑弑天下

已于 2022-07-25 16:10:06 修改

阅读量3.7k

点赞数

分类专栏： js 文章标签：前端

于 2022-07-25 16:01:38 首次发布

本文链接：https://blog.csdn.net/jingxin_123/article/details/125976671

版权

js 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

说明

必须引入的文件：

pdf.js
pdf.worker.js
jquery.min.js
pdfh5.js
pdfh5.css

HTML代码如下：

<!doctype html>

<html lang="en">
<head>
<link rel="stylesheet" href="pdfh5.css" />
	<script src="pdf.js" type="text/javascript" charset="utf-8"></script>
	<script src="pdf.worker.js" type="text/javascript" charset="utf-8"></script>
	<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
	<script src="pdfh5.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<div id="demo" ></div>
</body>
<script>
pdfh5 = new Pdfh5('#demo', {
		//此处的路径是后端返回的路径，请求头Content-Disposition必须设置为inline才能在线预览。也可以使用本地的pdf预览效果
		pdfurl: "http://localhost:9999/wx/file/certificate/access/4427821580960247808",
		URIenable:true,
		goto: 0,
		scrollEnable: false, // 是否允许pdf滚动
		zoomEnable: false, // 是否允许pdf手势缩放
	});
</script>
</html>