Привет, я пытаюсь создать флипбук, используя 'turnjs
' и 'pdf.js
'. Я в состоянии построить флипбук через локальный файл PDF, а также с помощью URL-адреса PDF в Интернете, когда я пытался использовать URL-адрес BLOB-объекта PDF, он показывает ошибку, как
Error: Access to 'blob:http://localhost:8080/41029659-ad46-4f1d-ba0a-6c874271cc38' from script denied
Но когда я пытался открыть этот URL, используя window.open
Я могу просмотреть PDF в новом окне.
Вот мой код
//file = '1.pdf'; // it works
file="blob:http://localhost:8080/41029659-ad46-4f1d-ba0a-6c874271cc38" // here im getting the error
// window.open(file); // it will shows the pdf in new window for blob url
PDFJS.getDocument(file).then(function (doc) {
pdfDoc = doc;
np = (doc.numPages);
scale = 3;
$(".flip-book").html('')
for (var i = 1; i <= np; i++) {
$(".flip-book").html($(".flip-book").html() + '<div><canvas id="canvs' + i + '" style="border: 1px solid black; width: 99.4%; height: 99.5%;"></canvas></div>');
}
for (var i = 1; i <= np; i++) {
hoja = document.getElementById('canvs' + i)
pdfDoc.getPage(i).then(function (page) {
var viewport = page.getViewport(scale);
hoja.height = viewport.height;
hoja.width = viewport.width;
var renderContext = {
canvasContext: hoja.getContext('2d'),
viewport: viewport
};
page.render(renderContext);
});
}
$('.flip-book').turn({
// Width
width: 922,
// Height
height: 600,
// Elevation
elevation: 50,
// Enable gradients
gradients: true,
// Auto center this flipbook
autoCenter: true
});
});