base64转PDF文件预览|Cannot read property 'GlobalWorkerOptions' of undefined

将后台发送过来的base64格式的文件转为PDF文件预览，这里使用的是pdf.js这个插件。

var pdfData = atob(接收的base64字段);

// 通过<script>标签加载, 创建快捷方式导出PDF.
var pdfjsLib = window['pdfjs-dist/build/pdf'];

// 必须要指定workerSrc属性.
pdfjsLib.GlobalWorkerOptions.workerSrc = '//mozilla.github.io/pdf.js/build/pdf.worker.js';

// 使用DoCuttoInPosits对象加载二进制数据。
var loadingTask = pdfjsLib.getDocument({data: pdfData});
loadingTask.promise.then(function(pdf) {
  console.log('PDF loaded');
  
  // 取得第一页
  var pageNumber = 1;
  pdf.getPage(pageNumber).then(function(page) {
    console.log('Page loaded');
    
    var scale = 1.5;
    var viewport = page.getViewport(scale);

    // 使用PDF页面尺寸制作画布
    var canvas = document.getElementById('the-canvas');
    var context = canvas.getContext('2d');
    canvas.height = viewport.height;
    canvas.width = viewport.width;

    // 将PDF页面渲染成画布上下文
    var renderContext = {
      canvasContext: context,
      viewport: viewport
    };
    var renderTask = page.render(renderContext);
    renderTask.then(function () {
      console.log('Page rendered');
    });
  });
}, function (reason) {

  console.error(reason);
});

引入下载下来 的文件的时候会报一个错Cannot read property ‘GlobalWorkerOptions’ of undefined

将pdfjsLib.GlobalWorkerOptions.workerSrc=‘’ 中的GlobalWorkerOptions 去掉就行了

它是将PDF渲染在画布上的。
也可以直接对PDF文件制作预览效果的界面。

详情看 http://mozilla.github.io/pdf.js/examples/

关注公众号回复“资料”即可获得为您精心准备的前端视频学习资料