在我的页面中,我正在尝试使用PDF JS显示我的pdf的缩略图,它适用于本地,但是当我在我的网络服务器上传代码时,pdf文件会自动下载。
代码:
$(function() {
var filePath = "http://example.com/public/uploads/docs/Document_One_1.pdf";
function Num(num) {
var num = num;
return function () {
return num;
}
};
function renderPDF(url, canvasContainer, options) {
var options = options || {
scale: 1.1
},
func,
pdfDoc,
def = $.Deferred(),
promise = $.Deferred().resolve().promise(),
width,
height,
makeRunner = function(func, args) {
return function() {
return func.call(null, args);
};
};
function renderPage(num) {
var def = $.Deferred(),
currPageNum = new Num(num);
pdfDoc.getPage(currPageNum()).then(function(page) {
var viewport = page.getViewport(options.scale);
var canvas = document.createElement("canvas");
canvas.setAttribute("id","pdfCanvas"+num);
canvas.setAttribute("onclick","popCanvas('{{url('/dashboard/showcanvas')}}','"+document.getElementById('pdfPath').innerHTML+"','"+num+"');");
var ctx = canvas.getContext('2d');
var renderContext = {
canvasContext: ctx,
viewport: viewport
};
if(currPageNum() === 1) {
height = viewport.height;
width = viewport.width;
}
canvas.height = height;
canvas.width = width;
canvasContainer.appendChild(canvas);
page.render(renderContext).then(function() {
def.resolve();
});
})
return def.promise();
}
function renderPages(data) {
pdfDoc = data;
var pagesCount = pdfDoc.numPages;
for (var i = 1; i <= pagesCount; i++) {
func = renderPage;
promise = promise.then(makeRunner(func, i));
}
}
PDFJS.disableWorker = true;
PDFJS.getDocument(url).then(renderPages);
};
var body = document.getElementById("bodyofpdf");
renderPDF(filePath, body);
});
当我更改文件路径网址时,例如:“https://www.tutorialspoint.com/bootstrap/bootstrap_tutorial.pdf”,它可以正常工作。
有人能帮帮我吗?
抱歉我的英语很差。
答案 0 :(得分:0)
如果您使用的是Laravel,则可以控制路径的行为,包括.pdf的行为。对于本地文件,默认情况下浏览器的行为与没有本地文件的行为不同。
我使用了很多PDF.js而且我不知道为什么要将用户直接链接到文件,你可以创建一个视图页面,在其中获取一个参数,如id或者名称预订然后用pdf.js加载它。如果您使用带文件扩展名的网址,则可能会混淆浏览器。
yourpage.com/books/view/{id_book}