Proveer la ruta del archivo HTML de la hoja exportada a través de la interfaz IFilePathProvider con JavaScript vía C++
Escenarios de uso posibles
Supón que tienes un archivo de Excel con múltiples hojas y deseas exportar cada hoja a un archivo HTML individual. Si alguna de tus hojas tiene enlaces a otras hojas, esos enlaces se romperán en el HTML exportado. Para solucionar esto, Aspose.Cells for JavaScript vía C++ proporciona la interfaz IFilePathProvider, que puedes implementar para arreglar los enlaces rotos.
Proporcione la ruta del archivo HTML de hoja de cálculo exportado a través de la interfaz IFilePathProvider
Descarga el archivo de Excel de ejemplo usado en el siguiente código y sus archivos HTML exportados. Todos estos archivos están en el directorio Temp. Debes extraerlo en la unidad C:. Luego, se convertirá en el directorio C:\Temp. Después, abrirás el archivo Sheet1.html en el navegador y harás clic en los dos enlaces dentro de él. Estos enlaces se refieren a estas dos hojas de Excel exportadas, que están en el directorio C:\Temp\OtherSheets.
file:///C:/Temp/OtherSheets/Sheet2.html#RANGE!A1
file:///C:/Temp/OtherSheets/Sheet3.html#RANGE!A1
La siguiente captura de pantalla muestra cómo se ven los enlaces en C:\Temp\Sheet1.html y sus vínculos
La siguiente captura de pantalla muestra el código fuente HTML. Como puedes ver, los enlaces ahora refieren al directorio C:\Temp\OtherSheets. Esto se logró usando la interfaz IFilePathProvider.
Código de muestra
Ten en cuenta que el directorio C:\Temp es solo para fines ilustrativos. Puedes usar cualquier directorio de tu elección y colocar allí el archivo de Excel de ejemplo y ejecutar el código de ejemplo proporcionado. Luego creará una subcarpeta OtherSheets dentro de tu directorio y exportará como HTML las segundas y terceras hojas de cálculo en ella. Cambia la variable dirPath en el código proporcionado y refiérelo al directorio que elijas antes de ejecutarlo.
Ten en cuenta que comentar estas líneas en el código romperá los enlaces en Sheet1.html, y Sheet2.html o Sheet3.html no se abrirán cuando hagas clic en sus enlaces dentro de Sheet1.html.
<!DOCTYPE html>
<html>
<head>
<title>Aspose.Cells Example</title>
</head>
<body>
<h1>Export Worksheet to HTML with FilePathProvider Example</h1>
<input type="file" id="fileInput" accept=".xls,.xlsx,.csv" />
<button id="runExample">Run Example</button>
<a id="downloadLink" style="display: none;">Download Result</a>
<div id="result"></div>
</body>
<script src="aspose.cells.js.min.js"></script>
<script type="text/javascript">
const { Workbook, SaveFormat, HtmlSaveOptions } = AsposeCells;
AsposeCells.onReady({
license: "/lic/aspose.cells.enc",
fontPath: "/fonts/",
fontList: [
"arial.ttf",
"NotoSansSC-Regular.ttf"
]
}).then(() => {
console.log("Aspose.Cells initialized");
});
// Implementation of IFilePathProvider for browser
class FilePathProvider extends AsposeCells.IFilePathProvider {
constructor() {
super();
}
// Converted method name from getFullName -> fullName per universal getter/setter conversion rule
fullName(sheetName) {
if (sheetName === "Sheet2") {
return "file:///OtherSheets/Sheet2.html";
} else if (sheetName === "Sheet3") {
return "file:///OtherSheets/Sheet3.html";
}
return "";
}
}
document.getElementById('runExample').addEventListener('click', async () => {
const fileInput = document.getElementById('fileInput');
const resultDiv = document.getElementById('result');
if (!fileInput.files.length) {
resultDiv.innerHTML = '<p style="color: red;">Please select an Excel file.</p>';
return;
}
const file = fileInput.files[0];
const arrayBuffer = await file.arrayBuffer();
// Instantiate Workbook from uploaded file
const workbook = new Workbook(new Uint8Array(arrayBuffer));
// Create HtmlSaveOptions and assign FilePathProvider (converted setter to property assignment)
const options = new HtmlSaveOptions();
options.filePathProvider = new FilePathProvider();
// Save workbook to HTML using options
const outputData = workbook.save(SaveFormat.Html, options);
const blob = new Blob([outputData], { type: 'text/html' });
const downloadLink = document.getElementById('downloadLink');
downloadLink.href = URL.createObjectURL(blob);
downloadLink.download = 'output.html';
downloadLink.style.display = 'block';
downloadLink.textContent = 'Download HTML File';
resultDiv.innerHTML = '<p style="color: green;">HTML exported successfully! Click the download link to get the result.</p>';
});
</script>
</html>
<!DOCTYPE html>
<html>
<head>
<title>Aspose.Cells Example - IFilePathProvider</title>
</head>
<body>
<h1>Aspose.Cells IFilePathProvider Example (Browser)</h1>
<p>Select the Sample_filepath.xlsx file to export worksheets to separate HTML files.</p>
<input type="file" id="fileInput" accept=".xls,.xlsx,.csv" />
<button id="runExample">Run Example</button>
<a id="downloadLink" style="display: none;">Download Result</a>
<div id="result"></div>
<div id="links"></div>
</body>
<script src="aspose.cells.js.min.js"></script>
<script type="text/javascript">
const { Workbook, SaveFormat, HtmlSaveOptions, Utils } = AsposeCells;
AsposeCells.onReady({
license: "/lic/aspose.cells.enc",
fontPath: "/fonts/",
fontList: [
"arial.ttf",
"NotoSansSC-Regular.ttf"
]
}).then(() => {
console.log("Aspose.Cells initialized");
});
// Implementation of IFilePathProvider interface for browser
class FilePathProvider extends AsposeCells.IFilePathProvider {
constructor() {
super();
}
// Gets the full path of the file by worksheet name when exporting worksheet to html separately.
// So the references among the worksheets could be exported correctly.
getFullName(sheetName) {
if (sheetName === "Sheet2") {
return "file:///OtherSheets/Sheet2.html";
} else if (sheetName === "Sheet3") {
return "file:///OtherSheets/Sheet3.html";
}
return "";
}
}
document.getElementById('runExample').addEventListener('click', async () => {
const fileInput = document.getElementById('fileInput');
const resultDiv = document.getElementById('result');
const linksDiv = document.getElementById('links');
linksDiv.innerHTML = '';
resultDiv.innerHTML = '';
if (!fileInput.files.length) {
resultDiv.innerHTML = '<p style="color: red;">Please select the Sample_filepath.xlsx file.</p>';
return;
}
const file = fileInput.files[0];
const arrayBuffer = await file.arrayBuffer();
// Instantiate workbook from uploaded file
const workbook = new Workbook(new Uint8Array(arrayBuffer));
// Check license
if (!workbook.isLicensed()) {
resultDiv.innerHTML = '<p style="color: red;">You must set the license to execute this code successfully.</p>';
return;
}
// Export each worksheet to separate HTML using HtmlSaveOptions and FilePathProvider
const sheetCount = workbook.worksheets.count;
for (let i = 0; i < sheetCount; i++) {
// Set the active worksheet to current index
workbook.worksheets.activeSheetIndex = i;
// Create html save option
const options = new HtmlSaveOptions();
options.exportActiveWorksheetOnly = true;
// Provide file path provider so hyperlinks among sheets are preserved correctly
options.filePathProvider = new FilePathProvider();
// Save the active worksheet to HTML (returns Uint8Array)
const outputData = workbook.save(SaveFormat.Html, options);
// Create downloadable blob for the HTML
const blob = new Blob([outputData], { type: 'text/html' });
// Determine filename similar to original logic
const sheetIndex = i + 1;
let filename = '';
if (i === 0) {
filename = 'Sheet1.html';
} else {
filename = `OtherSheets_Sheet${sheetIndex}_out.html`;
}
const link = document.createElement('a');
link.href = URL.createObjectURL(blob);
link.download = filename;
link.textContent = 'Download ' + filename;
link.style.display = 'block';
linksDiv.appendChild(link);
}
resultDiv.innerHTML = '<p style="color: green;">Worksheets exported successfully! Use the links below to download each HTML file.</p>';
});
</script>
</html>