Is it possible to render a specific range of pages in a pdf using pdf.js?
I currently have a PHP + Javascript project that classifies a pdf by ranges, so when the user chooses a range, I can only send the viewer the start page and it is responsible for initially displaying that page ignoring the range.
The problem arises when the complete pdf has more than 80 pages because the viewer will load all the pages even though the user only requires a specific range, for example, from page 5 to 10.
In case pdf.js does not allow me to do this, what library can I use to achieve this, thank you very much.
I can only send the viewer the start page and it is responsible for initially displaying that page ignoring the range.
This is my code in PHP.
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Visor de PDF Integrado con PDF.js</title>
<style>
body {
font-family: Arial, sans-serif;
display: flex;
flex-direction: column;
align-items: center;
margin: 20px;
}
iframe {
width: 90%;
height: 800px;
border: 1px solid #ccc;
margin-top: 20px;
}
input[type="file"] {
margin-top: 20px;
}
</style>
</head>
<body>
<h1>Visor de PDF Integrado</h1>
<input type="file" id="pdfFileInput" accept="application/pdf" />
<iframe id="pdfViewer" src=""></iframe>
<script>
const pdfFileInput = document.getElementById('pdfFileInput');
const pdfViewer = document.getElementById('pdfViewer');
let currentURL = null;
pdfFileInput.addEventListener('change', (event) => {
const file = event.target.files[0];
if (file && file.type === 'application/pdf') {
// Liberar URL anterior si existe
if (currentURL) {
URL.revokeObjectURL(currentURL);
}
// Crear una URL para el archivo PDF
currentURL = URL.createObjectURL(file);
// Establecer la fuente del iframe al visor de PDF.js con el archivo PDF
pdfViewer.src = `pdf.js/web/viewer.html?file=${encodeURIComponent(currentURL)}#page=2`;
} else {
alert("Por favor, selecciona un archivo PDF válido.");
}
});
</script>
</body>
</html>
I have already downloaded PDF.js and it works, but I don’t know how to configure a page range.