import { renderAsync } from "docx-preview";
|
import * as pdfjsLib from "pdfjs-dist";
|
import workerUrl from "pdfjs-dist/build/pdf.worker.min.mjs?url";
|
pdfjsLib.GlobalWorkerOptions.workerSrc = workerUrl;
|
/**
|
* 预览文件
|
* @param data 文件数据
|
* @param fileType 文件类型
|
* @param document 选择器或要渲染的dom对象
|
*/
|
export function previewFile(data, fileType, element) {
|
if (typeof element === "string") {
|
element = document.querySelector(element);
|
}
|
return new Promise(async (resolve, reject) => {
|
let fileData = data;
|
if (typeof data === "string") {
|
fileData = await fetch(data).then((res) => res.arrayBuffer());
|
}
|
|
switch (fileType) {
|
case "docx":
|
renderAsync(fileData, element)
|
.then(() => {
|
resolve(void 0);
|
})
|
.catch((err) => {
|
reject(err);
|
});
|
break;
|
case "pdf":
|
const loadingTask = pdfjsLib.getDocument(fileData);
|
loadingTask.promise
|
.then((pdf) => {
|
// Fetch the first page
|
for (let i = 1; i <= pdf.numPages; i++) {
|
// const pageNumber = 1;
|
|
pdf.getPage(i)
|
.then((page) => {
|
console.log("Page loaded");
|
|
const scale = 1;
|
const viewport = page.getViewport({
|
scale: scale,
|
});
|
|
// Prepare canvas using PDF page dimensions
|
const canvas =
|
document.createElement("canvas");
|
const context = canvas.getContext("2d");
|
canvas.height = viewport.height;
|
canvas.width = viewport.width;
|
element.appendChild(canvas);
|
|
// Render PDF page into canvas context
|
const renderTask = page.render({
|
canvasContext: context,
|
viewport: viewport,
|
});
|
renderTask.promise.then(function () {
|
console.log("Page rendered");
|
});
|
})
|
.catch((err) => {
|
reject(err);
|
});
|
}
|
})
|
.catch((err) => {
|
reject(err);
|
});
|
break;
|
case "xlsx":
|
break;
|
}
|
});
|
}
|