Me encuentro con un problema de caso extremo en el que si un usuario navega por algunas rutas de Nuxt, hace clic en el "logotipo" del sitio web, que es una etiqueta de anclaje en casa, luego hace clic en el botón de retroceso nativo del navegador y finalmente hace clic en un enlace que se supone para abrir un pdf, se redirige a mi página 404.
Si el usuario hace clic en el enlace pdf al cargar la página, se comporta como se esperaba. ¿No estás seguro de lo que está pasando aquí? Traté de agregar un método para forzar window.open en el pdf y todavía está roto.
Ejemplo de ancla:
<a class="text--uppercase decorate-hover" @click.prevent="forceHrefToPdf('Instructions.pdf')" > Instructions </a>Método:
forceHrefToPdf(pdf) { window.open(pdf, "_blank") } PDF está dentro del directorio /root/static .
Prueba este tal vez
<template> <button @click="downloadMe">download me</button> </template> <script> export default { methods: { downloadMe() { const link = document.createElement('a') link.href = '/Instructions.pdf' link.download = 'Intructions.pdf' link.target = '_blank' link.click() }, }, } </script> Además, no use a etiqueta a, está destinada a moverse de una página a otra. Más bien, utilice un button que tenga como objetivo realizar una action como descargar un PDF. Su cliente no es quien decide si es un enlace o no (los detalles de implementación no deberían importar aquí).
Por supuesto, esto también es totalmente factible pero no recomendado para todos.
<a href="/Instructions.pdf" target="_blank" download> Download my PDF via a link tag </a>