Anvil HTML to PDF API 발표

최근에 우리는 PDF API 을 포함하는 PDF generation endpoint 을 출시했습니다. 끝점을 사용하면 Markdown으로 완전히 새로운 PDF를 생성할 수 있습니다.

출시 이후 가장 많이 요청된 API 기능은 HTML to PDF였습니다. 개발자들은 완전한 제어를 원하며 생성된 PDF가 브랜드와 정확히 일치하기를 원한다고 말했습니다.

오늘 저는 HTML에서 PDF로의 지원이 모든 사람에게 제공된다는 사실을 발표하게 되어 기쁩니다! 이제 고유한 색상, 스타일 및 레이아웃 언어를 사용하여 원하는 대로 정확하게 보이는 PDF를 쉽게 생성할 수 있습니다.

example invoice PDF:



급히? HTML to PDF docs 및 청구서 예제 리포지토리를 확인하십시오.

안빌코 / html-pdf-송장-템플릿

브라우저에서 사용하고 HTML에서 PDF로 생성하기 위한 HTML 송장 템플릿입니다.

작동 원리

HTML에서 PDF로의 끝점은 기존 PDF 생성 끝점을 사용하지만 개체 배열 외에도 바닐라html 및 css 문자열을 허용합니다.

POST https://app.useanvil.com/api/v1/generate-pdf
{
  "type": "html",
  "data": {
    "html": `
      <h1 class='header-one'>What is Lorem Ipsum?</h1>
      <p>
        Lorem Ipsum is simply dummy text...
      </p>
    `,
    "css": `
      body { font-size: 14px; color: #171717; }
      .header-one { text-decoration: underline; }
    `,
  },
}

그게 다야! 익숙한 모든 HTML 및 CSS를 PDF 형식으로 전송 및 렌더링할 수 있습니다.
/api/v1/generate-pdf 끝점에 전달할 수 있는 모든 옵션에 대한 자세한 내용은 HTML to PDF docs을 참조하십시오.

언어별 클라이언트 사용

새로운 HTML to PDF 기능은 클라이언트 라이브러리에서도 지원됩니다.

안빌코 / 노드 앤빌

Anvil용 노드 API 클라이언트

안빌코 / 파이썬 모루

Anvil API용 Python 라이브러리 및 CLI

먼저 API 키가 필요합니다. Sign up을 모루로 가져간 다음 API key을 가져옵니다.

다음은 노드의 예입니다. YOUR_API_KEY를 키로 바꾸고 HTML/CSS를 자신의 코드로 바꿉니다.

const fs = require('fs')
const path = require('path')
const Anvil = require('@anvilco/anvil')

const client = new Anvil({ apiKey: YOUR_API_KEY })
const example = {
  type: 'html',
  title: 'HTML Invoice',
  data: {
    html: '<h1>...',
    css: 'body { ... } ...',
  },
}
const { statusCode, data, errors } = await client.generatePDF(example)

if (statusCode === 200) {
  fs.writeFileSync('invoice.pdf', data, { encoding: null })
} else {
  console.log(statusCode, JSON.stringify(errors || data, null, 2))
}

그리고 파이썬에서:

from python_anvil.api import Anvil

anvil = Anvil(api_key=YOUR_API_KEY)
data = {
    "title": "Example Invoice",
    "data": {
        "html": "<h1>...",
        "css": "body { ... } ..."
    }
}

response = anvil.generate_pdf(data)

브라우저 너머

HTML 및 CSS는 브라우저 대신 PDF용으로 렌더링되므로 매체에 따라 특별히 고려해야 할 사항이 있을 수 있습니다. 예를 들어 페이지 번호는 브라우저에서는 의미가 없지만 PDF에서는 의미가 있습니다.

PDF 렌더링을 더 잘 제어할 수 있는 몇 가지 추가 PDF 관련 CSS 기능이 있습니다. 다음 포스팅에서 좀 더 구체적으로 다루도록 하겠습니다. 지금은 인보이스 예제에서 다루는 몇 가지 흥미로운 기능이 있습니다.

여백에서 렌더링

많은 PDF에는 각 페이지의 여백에 렌더링된 페이지 번호가 있습니다. API를 사용하면 각 모서리의 여백에 렌더링되는 내용을 제어할 수 있습니다. invoice example 에서 렌더링된 두 항목은 아래쪽 여백에 있습니다.

왼쪽 하단: 임의의 요소가 마지막 페이지에만 렌더링됨

오른쪽 하단: 각 페이지에 번호 매기기가 추가되고 스타일이 지정되었습니다

.

표 머리글 반복

브라우저에서는 표가 다른 페이지로 넘칠 수 없지만 PDF에서는 가능합니다! 테이블이 오버플로되면 기본적으로 API는 다음 페이지에서 테이블의 헤더를 반복합니다.

예

위에서 언급한 기능을 보여주는 example HTML/CSS invoice template 을 구성했습니다. 여기에는 브라우저와 API 모두에서 렌더링되는 HTML 및 CSS가 포함되어 있습니다. PDF를 빠르게 생성하는 데 도움이 되는 example node script이 포함되어 있습니다.

통합을 바로 시작하려면 확인하십시오!

앞으로

Anvil에서는 개발자를 위해 PDF를 추상화하는 임무를 수행하고 있습니다. 이 새로운 HTML to PDF 기능이 PDF 작업을 수월하게 만드는 데 큰 도움이 되기를 바랍니다.

마지막으로 PDF 및/또는 서류 작업 자동화로 멋진 것을 개발하고 있다면 더 많은 소식을 듣고 싶습니다! [email protected]로 알려주세요.