cover

¿Sabes cómo entregar archivo PDF desde tu web?

author photo

Héctorbliss

@hectorbliss


robot logo saying hello

No te quedes atrás: Actualízate

Suscríbete para recibir información sobre nuevos frameworks, updates, eventos, tips, hacks y más.

En Remix es muy fácil entregar archivos PDF con el componente Link.

Supongamos que tenemos la ruta app/routes/guias-pdf/$id.js Y dentro de esta ruta tenemos un link de descarga de esta guía en PDF:

export default function GuiaDeTypescript(){ return (<> <h2>Esta es la página de detalle de la guía de Typescript</h2> <Link to="pdf" reloadDocument> Descargar el PDF </Link> </>) }

Observa cómo hemos apuntado el link hacia una sub ruta llamada pdf y le hemos pedido al link, que use el navegador para el enrutamiento en vez de hacerlo en segundo plano.

Ahora veamos la ruta app/routes/guias-pdf/$id.pdf.js que será una ruta de recurso pues no tiene una exportación por default, solo un loader.

export async function loader({ params }: LoaderArgs) { const pdf = await generatePDF(params.id); // si quieres ver cómo se genera el PDF da clic en el enlace de abajo. return new Response(pdf, { status: 200, headers: { "Content-Type": "application/pdf", }, }); }

De esta sencilla forma puedes controlar muy bien las descargas de documentos con Remix.

Abrazo. Bliss.

Enlaces relacionados

Remix docs

Generando un PDF en Remix

banner

¿Quieres mantenerte al día sobre los próximos cursos y eventos?

Suscríbete a nuestro newsletter

Jamás te enviaremos spam, nunca compartiremos tus datos y puedes cancelar tu suscripción en cualquier momento 😉

robot logo saying hello
facebook icontwitter iconlinkedin iconinstagram iconyoutube icon

© 2016 - 2023 Fixtergeek