導覽

JavaScript

JavaScript SDK

了解如何用 bannerify-js 套件生成圖片和 PDF。

bannerify-js 是 JavaScript 和 TypeScript 的 Bannerify 用戶端。每個選項都有型別,並以值的形式回傳錯誤,所以請求失敗時不會擲出例外。

安裝

Examples

Open only what you need

npm
npm install bannerify-js
pnpm
pnpm add bannerify-js
yarn
yarn add bannerify-js
bun
bun add bannerify-js

建立用戶端

你需要一組 API 金鑰。請到儀表板的 API Keys 頁面建立,並把它留在伺服器上。

import { Bannerify } from "bannerify-js"

const bannerify = new Bannerify(process.env.BANNERIFY_API_KEY!)

createClient(apiKey) 會回傳同一個用戶端。

生成圖片

import { writeFile } from "node:fs/promises"

const { result, error } = await bannerify.createImage("tpl_xxx", {
  modifications: [{ name: "headline", text: "Summer sale" }],
})

if (error) throw new Error(error.message)

await writeFile("banner.png", Buffer.from(result))

result 是存放圖片位元組的 ArrayBuffer。

方法

方法 結果 用途
createImage ArrayBuffer 取得圖片的位元組
createPdf ArrayBuffer 取得 PDF
createStoredImage 網址字串 取得託管的圖片網址
renderVideo (Beta) 事件的非同步迭代器 渲染影片並追蹤進度
renderAndWaitVideo (Beta) 網址字串 渲染影片並取得它的 MP4 網址
createVideo (Beta) 影片 ID 開始影片並立即取得它的 ID
getVideo (Beta) 影片狀態和網址 依 ID 再次讀取影片
watchVideo (Beta) 事件的非同步迭代器 依 ID 再次追蹤影片
generateImageSignedUrl 網址字串 建立一個在有人開啟時渲染的連結

前三個方法請見建立圖片和 PDF,影片方法請見渲染影片,最後一個請見簽署網址。

處理錯誤

除了 generateImageSignedUrl 之外,每個方法都會回傳含有 result 或 error 的物件。檢查 error 之後,TypeScript 會縮小型別。

const { result, error } = await bannerify.createImage("tpl_xxx")

if (error) throw new Error(`${error.code}: ${error.message}`)

console.log(result.byteLength)

error 有四個欄位:code、message、docs 和 requestId。docs 連結到該代碼的頁面。需要針對某個請求尋求協助時,請把 requestId 提供給支援團隊。

SDK 自己新增了兩個代碼。INVALID_FORMAT 表示圖片格式不是 png、jpeg 或 webp。TIMEOUT_ERROR 表示請求超過逾時時間。不是來自 API 的失敗,例如連線中斷,則會擲出例外。

generateImageSignedUrl 會回傳字串,當格式不受支援時會擲出例外。

選項

const bannerify = new Bannerify(process.env.BANNERIFY_API_KEY!, {
  timeout: 30_000,
})
選項 預設值 說明
timeout 60000 請求逾時時間,單位為毫秒
baseUrl https://api.bannerify.co/v1 API 的基本網址
fetch 全域的 fetch 自訂的 fetch,用於測試或代理伺服器