个人中心
gpt4 book ai didi

html - 内联 PDF 查看器

转载 作者：数据小太阳 更新时间：2023-10-29 07:40:21 26 4
gpt4 key购买 nike

是否有 PDF 查看器，我可以将其嵌入到我的 HTML 中并根据需要设置样式。

实际上我需要显示一些 PDF 文件页面并自定义我自己的 UI(几个按钮可以翻页和评论)。

如果有任何 Ruby 解决方案(据我所知，它实际上与编程无关)，那将是很棒的。

我想显示 pdf 因为:

  • 用户可以复制文本
  • 文本采用原始布局

所以我不想将其显示为图像或转换后的文本。但我想以简单的设计显示页面。没有 Flex 或其他任何东西。

最佳答案

是的，使用 HTML5 是可能的!

https://github.com/mozilla/pdf.js/

这是一个纯 javascript 库，它使用 HTML5 函数打开 PDF 文件并将其呈现在页面中。我在以下浏览器中成功测试了该库:

  • IE9 和当前版本的 Google Chrome、Firefox、Safari
  • IE8 及更低版本不支持 pdf.js(缺少 HTML5 功能)

用法

在 HTML 文件中包含 javascript 库并添加一个 - 元素(是 HTML5 元素，因此它只能在 HTML5 浏览器中工作):

<body>
  <canvas id="the-canvas" style="border:1px solid black;"/>
</body>

使用与此类似的 javascript 调用在 Canvas 内呈现 PDF:

PDFJS.getDocument('your-file-goes-here.pdf').then(function(pdf) {
  pdf.getPage(1).then(function(page) {
    var scale = 1.5;
    var viewport = page.getViewport(scale);

    var canvas = document.getElementById('the-canvas');
    var context = canvas.getContext('2d');
    canvas.height = viewport.height;
    canvas.width = viewport.width;

    var renderContext = {
      canvasContext: context,
      viewport: viewport
    };
    page.render(renderContext);
  });
});

关于html - 内联 PDF 查看器，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/5586717/

26 4 0
文章推荐： ruby-on-rails - 用于大型 XML 下载的快速 ruby​​ http 库
文章推荐： ios - 如何更改分组类型 UITableView 中标题的字体颜色？
文章推荐： ios - 如果部分标题隐藏在 UICollectionView 中，则删除空白区域
文章推荐： ruby - Hash 是否覆盖 Enumerable#map()？
数据小太阳
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com