Signed URLs

Pixelstack lets you sign your design image URLs to prevent anyone from tweaking query-string parameters and hammering your CDN cache. When the Require signed URLs setting is ON, any request missing a valid signature will be rejected with HTTP 403.

Enforcing signed URLs

1. Open Design Settings

   In the editor, click the Design settings button ( icon, top-right corner).

2. Toggle the switch

   Enable Require signed URLs and click Save.

Once saved, the public image endpoint will only accept requests that include a valid Policy, Signature, and Key-Pair-Id query parameter trio.

Generating a signature

Because signing requires your API key, it must happen server-side. You have two options:

1. Use the Pixelstack JavaScript client

import { PixelstackClient } from '@pixelstack/client';

// Never expose your API key in the browser – keep this code on your server!
const pixelstack = new PixelstackClient({
  teamId: 'your-team-id',
  apiKey: process.env.PIXELSTACK_API_KEY!,
});

// 1. Build the _unsigned_ URL the way you normally would
const unsignedUrl = `https://cdn.pixelstack.io/your-team-id/my-design?width=600&fill=%23fff`;

// 2. Ask Pixelstack to sign it
const signedUrl = await pixelstack.signUrl(unsignedUrl);

// 3. Use the signed URL in the <img> tag, social share, etc.
return `<img src="${signedUrl}" alt="My dynamic image" />`;

2. Call the REST endpoint directly

GET https://api.pixelstack.io/public/team/{teamId}/signUrl?url={ENCODED_URL}
X-Api-Key: {your_api_key}

Response:

{
  "signedUrl": "https://cdn.pixelstack.io/...&Policy=...&Signature=...&Key-Pair-Id=..."
}

Example in Node.js

import fetch from 'node-fetch';

export async function getSignedDesignUrl() {
  const teamId = 'your-team-id';
  const apiKey = process.env.PIXELSTACK_API_KEY;
  const unsigned = `https://cdn.pixelstack.io/${teamId}/my-design?title=Hello`;

  const res = await fetch(
    `https://api.pixelstack.io/public/team/${teamId}/signUrl?url=${encodeURIComponent(unsigned)}`,
    { headers: { 'X-Api-Key': apiKey } }
  );

  if (!res.ok) throw new Error('Failed to sign URL');
  const { signedUrl } = await res.json();
  return signedUrl;
}