Images & CORS

Remote images must be accessible to the browser during rendering.

Recommended:

html2canvas: {
  useCORS: true,
}

For external images:

• configure appropriate CORS headers
• avoid inaccessible authenticated image URLs
• prefer data URLs for critical logos when practical
• preserve image aspect ratio

Normal content image CSS:

.pdf-root img {
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

Header/footer logo sizing is already aspect-ratio-safe internally. Their width and height props define maximum bounds instead of forced image dimensions.

v1.3.0 image optimization

Version 1.3.0 adds opt-in autoOptimize with target DPI, JPEG quality, alpha preservation, size caps and per-export repeated-image reuse. It leaves existing library image quality unchanged when disabled. A cross-origin image that cannot be decoded is left in the private staging DOM with a warning; the renderer's CORS rules still decide whether it appears. A tainted watermark instead raises an error. Use same-origin media, configure Access-Control-Allow-Origin on the source server, or supply a suitable data URL. See media and typography.