| Advertencia |
|---|
|
Ahora mismo este código da problemas, lo estamos revisando, actualizaremos la guía en cuanto lo tengamos solucionado. |
...
Recibir PDF y darle el formato necesario
...
| Bloque de código |
|---|
|
return axios.getapiRequest({ url, { responseType: "arraybuffer" }); |
...
| Bloque de código |
|---|
|
export default {
// Descargar un b64ToUint6(nChr) {
return nChr > 64 && nChr < 91 ? nChr - 65 : nChr > 96 && nChr < 123 ? nChr - 71 : nChr > 47 && nChr < 58 ? nChr + 4 : nChr === 43 ? 62 : nChr === 47 ? 63 : 0;
},
pdf (arraybuffer)
descargarPdf(pdfArrayBuf, nombre) {
const blob = new Blob([pdfArrayBuf], {
type: 'application/pdf',
});
// IE doesn't allow using a blob object directly as link href
// instead it is necessary to use msSaveOrOpenBlob
if (window.navigator && window.navigator.msSaveOrOpenBlob) {
window.navigator.msSaveOrOpenBlob(blob);
return;
}
// For other browsers:
// Create a link pointing to the ObjectURL containing the blob.
const data = window.URL.createObjectURL(blob);
const link = document.createElement('a');
link.href = data;
link.download = nombre;
link.click();
setTimeout(() => {
// For Firefox it is necessary to delay revoking the ObjectURL
window.URL.revokeObjectURL(data);
}, 100);
},
// Pasar un arraybuffer a un objeto con el fomato para el visor vue-pdf
pdfVisor(pdfArrayBuf) {
return {
data: pdfArrayBuf,
};
},
// Pasar de base 64 a array de bytes - Si viene como string en base 64,
// por ejemplo dentro de un objeto,tendremos que transformarlo
base64DecToArr(sBase64, nBlocksSize) {
varconst sB64Enc = sBase64.replace(/[^A-Za-z0-9\+\/]/g, ""''),;
const nInLen = sB64Enc.length,;
const nOutLen = nBlocksSize
// eslint-disable-next-line no-bitwise
? Math.ceil(((nInLen * 3 + 1) >> 2) / nBlocksSize) * nBlocksSize
// eslint-disable-next-line no-bitwise
: (nInLen * 3 + 1) >> 2,;
const taBytes = new Uint8Array(nOutLen);
for (varlet nMod3, nMod4, nUint24 = 0, nOutIdx = 0, nInIdx = 0; nInIdx < nInLen; nInIdx ++= 1) {
// eslint-disable-next-line no-bitwise
nMod4 = nInIdx & 3;
// eslint-disable-next-line no-bitwise
nUint24 |= this.b64ToUint6(sB64Enc.charCodeAt(nInIdx)) << (18 - 6 * nMod4);
if (nMod4 === 3 || nInLen - nInIdx === 1) {
for (nMod3 = 0; nMod3 < 3 && nOutIdx < nOutLen; nMod3 ++= 1, nOutIdx ++= 1) {
// eslint-disable-next-line no-bitwise
taBytes[nOutIdx] = (nUint24 >>> ((16 >>> nMod3) & 24)) & 255;
}
nUint24 = 0;
}
}
return taBytes;
},
descargarPdf(pdfArrayBuf, nombre) {
var blob = new Blob([pdfArrayBuf], { type: "application/pdf" });// Función auxiliar para la anterior
base64ToUint6(nChr) {
//if IE doesn't allow using a blob object directly as link href
// instead it is necessary to use msSaveOrOpenBlob(nChr > 64 && nChr < 91) {
return nChr - 65;
}
if (window.navigatornChr > 96 && window.navigator.msSaveOrOpenBlob nChr < 123) {
window.navigator.msSaveOrOpenBlob(blob);
returnreturn nChr - 71;
}
//if For(nChr other> browsers:
47 && nChr < // Create a link pointing to the ObjectURL containing the blob.58) {
return nChr + 4;
const data = window.URL.createObjectURL(blob);}
varif link(nChr = document.createElement("a");
== 43) {
link.href =return data62;
link.download}
= nombre;
if link.click();
setTimeout(function((nChr === 47) {
// For Firefox it is necessary to delay revoking the ObjectURL
window.URL.revokeObjectURL(data)return 63;
}, 100);
},
pdfVisor(pdfArrayBuf) {
return { data: pdfArrayBuf }return 0;
},
}; |
Para utilizarlo en nuestros componentes, sólo tendríamos que importarlo y ya podríamos usarlo con pdfUtil.metodo(), así:
...
| Bloque de código |
|---|
|
<div class="visorPdf" style="width: 60%; margin-left:auto; margin-right:auto">
<pdf v-if="objConPdf" :src="pdfVisor" style="border: solid 1px grey" />
</div> |
En el parámetro src le tenemos que indicar un objeto con una estructura, que podemos obtener con pdfUtil.pdfVisor(pdfArrayBuffer).
...