Ingen upload, 100% lokalt, ingen konto

HTML til PDF

Indsæt HTML, vælg en sidestørrelse, og download en PDF, alt gengives i din browser.

Sådan virker HTML til PDF

HTML til PDF tager HTML-markup, du indsætter i editoren, renser det med DOMPurify for at fjerne scripts og usikre attributter, gengiver det på et off-screen canvas ved hjælp af html2canvas og enkoderer resultatet til en PDF med jsPDF. Hele pipelinen kører inde i din browserfane; ingen HTML-kode eller gengivet output sendes til nogen server. Dette gør det egnet til konvertering af HTML-uddrag, der indeholder personlige data, som du ikke vil indsætte i en onlinetjeneste.

Forstå outputformatet, for du stoler på det. PDF-siderne er rasterbilleder, ikke vektortekst. Teksten i outputtet er ikke valgbar, ikke søgbar og kan ikke tilpasses. Eksterne ressourcer som billeder refereret ved URL blokeres af browser-CORS-politik og indlades ikke. Inline-styles og indlejret CSS fungerer, men komplekse layouts med brugerdefinerede webskrifttyper eller avancerede CSS-gitter gengives muligvis ikke nøjagtigt. Til dokumenttro konvertering af fulde websider er en serverdrevet headless browser det mere passende værktøj.

Skrevet af Bastien Sulyan

Sådan bruger du HTML til PDF, trin for trin

  1. Indsæt din HTML-markup i editoromradet.
  2. Juster eventuelt sidestørrelsen (A4 eller Letter) og retningen.
  3. Klik på convert; DOMPurify renser HTML-koden, og html2canvas gengiver den.
  4. Vent på, at jsPDF enkoderer canvas-outputtet som PDF-sider.
  5. Download PDF-filen.

Almindelige anvendelser

  • Du genererede en HTML-faktura i din browser fra en lokal skabelon og vil have en PDF-kopi uden at e-maile den til en konverteringstjeneste.
  • En simpel HTML-rapport bygget fra API-data skal gemmes som en PDF til arkivering; indsæt HTML og konverter lokalt.
  • Du har skrevet en stylet HTML-e-mailskabelon og vil se, hvordan den ville se ud udskrevet som en PDF.
  • En developer har brug for en hurtig PDF fra et HTML-fragment under testning, uden at satte en server-side headless browser op.

Ofte stillede spørgsmål

Hvorfor er teksten i output-PDF-filen ikke valgbar?

Konverteringspipelinen gengiver HTML til en canvas-bitmap ved hjælp af html2canvas og enkoderer derefter den bitmap som billeddata inde i PDF-siderne med jsPDF. Outputtet er et rasteriseret billede, ikke et tekstlag. Hvis du har brug for en PDF med valgbar tekst, har du brug for en server-side headless browser som Puppeteer, som dette værktøj bevidst undgår for at holde behandlingen lokal.

Hvorfor vises billeder i min HTML ikke i PDF-filen?

Billeder indlæst fra eksterne URL'er er underlagt browser-CORS-politik. Hvis billedserveren ikke sender tilladende CORS-headers, kan html2canvas ikke læse pixeldataene, og billedpladsen gengives blank. Inline base64-enkodede billeder direkte indlejret i HTML eller billeder fra samme oprindelse fungerer uden denne begrænsning.

Sendes den HTML, jeg indsætter, til en server?

Nej. HTML-koden forbliver i browserhukommelsen hele vejen. DOMPurify renser den client-side, html2canvas gengiver den client-side, og jsPDF enkoderer PDF-filen client-side. Intet forlader browserfanen.

Hvad fjerner DOMPurify-rensning?

DOMPurify fjerner script-tags, hændelseshåndteringsattributter som onclick og onload, javascript: URL'er og andre konstruktioner, der kan udføre kode. Det bevarer strukturel og styling-markup, så det gengivne output ser det samme ud, men er sikkert at indsætte i en dokumentkontekst.

Kan jeg konvertere en fuld webside-URL i stedet for at indsætte HTML?

Nej. Værktøjet fungerer med HTML-markup, du indsætter direkte. Indlæsning af en URL ville kræve at hente siden, hvilket støder ind i CORS-begrænsninger for de fleste websteder og ville involvere en netværksanmodning, der tager operationen ud af den lokale behandlingsmodel.