Question

虽然我认为答案可能在this other question关于pdf规范的答案中，但在嵌入式pdf文档中是否可以不显示 adobe acrobat工具栏？

Answer 1

以下代码将嵌入一个没有任何工具栏的pdf：

<embed src="http://URL_TO_PDF.com/pdf.pdf#toolbar=0&navpanes=0&scrollbar=0" width="425" height="425">

有关详细信息，请参阅此博客：http://blogs.adobe.com/pdfdevjunkie/2007/08/using_the_html_embed_tag_to_di.html

有关嵌入式标签的完整参数列表，请参阅：
http://www.adobe.com/content/dam/Adobe/en/devnet/acrobat/pdfs/pdf_open_parameters.pdf

Answer 2

您可以使用#toolbar隐藏在工具栏上方。如果工具栏= 0，则将其禁用。.当工具栏= 1时，将启用它。这对我有用

<embed src="filename.pdf#toolbar=0" width="500" height="375"> (Disable toolbar)
<embed src="path/filename.pdf#toolbar=1" width="500" height="375"> (Enable toolbar

Answer 3

不能保证，在URL中使用#toolbar=0是可行的，因为这是使用Adobe查看器的浏览器所独有的，可能其他浏览器甚至具有与保持兼容性，但肯定不是每个人都遵循，例如MacOS浏览器的浏览器或Linux。

在大多数浏览器中，可以更改视图，该视图也可能不适用于#toolbar=0，因为查看器与浏览器不同，例如Firefox内部具有自己的查看器，因此不起作用与此#toolbar=0一起，查看以下结果：

<iframe
    src="sample.pdf#toolbar=0"
    width="900"
    height="200"
></iframe>

<br>

<embed type="application/pdf"
    src="sample.pdf#toolbar=0"
    width="900"
    height="200"
>

即使它在Firefox和带有扩展名的Chrome中都可以使用，也可以将PDF查看器更改为其他可能不支持此参数的东西。

即使您可以删除所需的所有按钮，也仍然可以复制PDF或图像，因为所有内容都在渲染之前已下载到您的计算机中，因此用户只需按 F12 即可打开DevTools （Chrome / Firefox），查看“网络”标签并对其进行过滤，以获取当前页面上已加载的所有PDF，DevTools会将其复制到该PDF的任何文件夹中。

没有办法阻止，只能阻止。正如已经看到的那样，“ iframe”和“ embedd”都无法解决，我建议（仅是建议）使用PDF.js。

因此，您可以创建自己的按钮，导航等，所有内容都将在<canvas>中运行，例如：

var url = 'https://raw.githubusercontent.com/mozilla/pdf.js/ba2edeae/web/compressed.tracemonkey-pldi-09.pdf';

var pdfjsLib = window['pdfjs-dist/build/pdf'];

pdfjsLib.GlobalWorkerOptions.workerSrc = '//mozilla.github.io/pdf.js/build/pdf.worker.js';

var pdfDoc = null,
    pageNum = 1,
    pageRendering = false,
    pageNumPending = null,
    scale = 1.5,
    canvas = document.getElementById('pdf-example'),
    ctx = canvas.getContext('2d');


function renderPage(num) {
  pageRendering = true;

  pdfDoc.getPage(num).then(function(page) {
    var viewport = page.getViewport({scale: scale});
    canvas.height = viewport.height;
    canvas.width = viewport.width;

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

    renderTask.promise.then(function() {
      pageRendering = false;
      if (pageNumPending !== null) {
        renderPage(pageNumPending);
        pageNumPending = null;
      }
    });
  });

  document.getElementById('page_num').textContent = num;
}


function queueRenderPage(num) {
  if (pageRendering) {
    pageNumPending = num;
  } else {
    renderPage(num);
  }
}

/**
 * show previous page
 */
function onPrevPage() {
  if (pageNum > 1) {
    pageNum--;
    queueRenderPage(pageNum);
  }
}

document.getElementById('prev').addEventListener('click', onPrevPage);

/**
 * show next page
 */
function onNextPage() {
  if (pageNum < pdfDoc.numPages) {
    pageNum++;
    queueRenderPage(pageNum);
  }
}

document.getElementById('next').addEventListener('click', onNextPage);

/**
 * PDF async "download".
 */
pdfjsLib.getDocument(url).promise.then(function(pdfDoc_) {
  //Set loaded PDF to main pdfDoc variable
  pdfDoc = pdfDoc_;

  //Show number of pages in document
  document.getElementById('page_count').textContent = pdfDoc.numPages;

  renderPage(pageNum);
});

#pdf-example {
    border: 1px solid black;
}

<script src="//mozilla.github.io/pdf.js/build/pdf.js"></script>

<div>
  <button id="prev">Previous page</button>

  <button id="next">Next page</button>

  <span>Page: <span id="page_num"></span> / <span id="page_count"></span></span>
</div>

<canvas id="pdf-example"></canvas>

请注意，我使用1.5进行缩放：

 scale = 1.5,

 ...

 var viewport = page.getViewport({scale: scale});

您可以根据需要进行更改。我建议您根据视口测量值进行调整（可以使用window.innerWidth进行计算），但也要进行最小测量，以适应不同的分辨率。

隐藏嵌入式pdf的工具栏？

3 个答案: