The Most

Affordable

Screenshot

API

// in this example we will create a render link, you can directly use in an img tag

// this import is only required in nodejs , when you want to save file to disk
import fs from "node:fs/promises"

// we need to install a package to use in browser as well as server environment (nodejs)
import { Crypto } from "@peculiar/webcrypto"

// find accessToken and apiSecret from dashboard
// https://www.screenshotbuddy.com/dashboard/api-keys
const accessToken = "your-access-token"
const apiSecret = "your-api-secret"

// api endpoint
const apiEndpoint = "https://api.screenshotbuddy.com/render"

// add any options you want
const options = {
  url: "https://www.wikipedia.org",
  full_page: false,
  format: "png",
}

let queryString = new URLSearchParams(options)

// creating a signature
const encoder = new TextEncoder()
const webCrypto = new Crypto()

let algorithm = { name: "HMAC", hash: "SHA-256" }
let key = await webCrypto.subtle.importKey(
  "raw",
  encoder.encode(apiSecret),
  algorithm,
  false,
  ["sign", "verify"],
)
const digest = await webCrypto.subtle.sign(
  algorithm.name,
  key,
  encoder.encode(queryString),
)

// signature is created here
const signature = Array.from(new Uint8Array(digest))
  .map((b) => b.toString(16).padStart(2, "0"))
  .join("")

// building a signed image url you can use publicly, adding signature as query parameter
const screenshotUrl = `${apiEndpoint}/${accessToken}?${queryString}&signature=${signature}`

// now you can use this url in an img tag to display the image

// you can also fetch image from this url and save to disk
// fetching image
const response = await fetch(screenshotUrl)

// saving image to disk if response code is 200
if (response.status == 200) {
  const buffer = await response.arrayBuffer()
  await fs.writeFile("image.png", Buffer.from(buffer))
}

# in this example we will create a render link, you can directly use in an img tag

import urllib.parse
import hmac
import hashlib
import requests

# find accessToken and apiSecret from dashboard
# https://www.screenshotbuddy.com/dashboard/api-keys

accessToken = "your-access-token"
apiSecret = "your-api-secret"

# add any options you want
options = {
    "url": "https://www.wikipedia.org",
    "full_page":false,
    "format":"png"
  }

# creating a query string with all options we set above
query_string=urllib.parse.urlencode(options, doseq=True)

# a signature will be created here to generate a signed url
signature=hmac.new(
            bytes(accessToken, "utf-8"),
            msg=bytes(query_string, "utf-8"),
            digestmod=hashlib.sha256,
        ).hexdigest()

# building a signed image url you can use publicly using signature as query string 
screenshot_url=f"https://api.screenshotbuddy.com/render/{accessToken}?{query_string}&signature={signature}"

# now you can use this url in any img tag to display the image like this <img src="{{  screenshot_url }}"/>

# you can also fetch image from this url and save to disk
# fetching image
response = requests.get(url,stream=True)

# saving to disk if response code is 200
if response.status_code == 200:
  with open('image.png', 'wb') as out_file:
    shutil.copyfileobj(response.raw, out_file)
  
  del response