Skip to main content

​
Overview

This guide walks you through integrating Sticker into your platform. The entire process takes approximately 2-4 hours and requires implementing two API endpoints.

​
Prerequisites

Before you begin, make sure you have:
  • Partner API Key (provided by Sticker team)
  • Partner ID (UUID provided by Sticker team)
Contact us at suyash@usesticker.com to get your credentials.
  • Backend server capable of making HTTPS requests
  • Frontend capable of rendering iframes
  • HTTPS enabled (required for production)

​
Integration Steps

1

Get Your API Credentials

Contact the Sticker team to receive your:
  • Partner ID (UUID)
  • Partner API Key (starts with sk_live_ or sk_test_)
  • API Base URL
# Store these securely in your environment variables
STICKER_API_KEY=sk_live_your_api_key_here
STICKER_API_URL=https://api.usesticker.com/v1
2

Implement Organization Setup

When a customer enables the supplies module, call the organization setup endpoint to provision their account.Endpoint: POST /v1/organizations/setup
const response = await fetch('https://api.usesticker.com/v1/organizations/setup', {
  method: 'POST',
  headers: {
    'Authorization': `Bearer ${process.env.STICKER_API_KEY}`,
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({
    // Your internal organization identifier
    internalOrgId: 'org-12345',
    organizationName: 'Acme Medical Practice',
    
    // Your internal user identifier
    internalUserId: 'user-789',
    user: {
      firstName: 'Dr. Jane',
      lastName: 'Smith',
      email: 'jane@acmemedical.com',
      phoneNumber: '555-0100'  // Optional
    },
    
    // Shipping locations (optional but recommended)
    shippingLocations: [
      {
        internalShippingLocationId: 'loc-001',
        name: 'Main Office',
        address: {
          line1: '123 Medical Plaza',
          line2: 'Suite 200',  // Optional
          city: 'San Francisco',
          province: 'California',  // Full state name or abbreviation
          postalCode: '94102',
          country: 'United States'  // Optional, defaults to US
        },
        isDefault: true
      }
    ]
  })
});

const result = await response.json();
// Store result.data.profile.id for future handshake calls
The internalOrgId and internalUserId are your internal identifiers. Use them to link Sticker data back to your system.
3

Implement User Handshake

Every time a user opens the supplies module, call the handshake endpoint to authenticate them.Endpoint: POST /v1/partner/handshake
const response = await fetch('https://api.usesticker.com/v1/partner/handshake', {
  method: 'POST',
  headers: {
    'X-API-Key': process.env.STICKER_API_KEY,
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({
    internal_user_id: 'user-789'  // Your internal user ID
  })
});

const { session_key, iframe_embed_url } = await response.json();
// Use iframe_embed_url directly, or build your own URL with session_key
Session tokens expire after 5 minutes and are single-use only. Generate a new one for each user session.
4

Embed the iframe

Use the returned iframe_embed_url or construct your own URL with the session_key:
// React/Next.js example
<iframe
  src={iframeEmbedUrl}
  className="w-full h-full border-0"
  title="Sticker Embedded Procurement"
  sandbox="allow-same-origin allow-scripts allow-forms allow-popups allow-popups-to-escape-sandbox allow-top-navigation-by-user-activation"
  allow="payment; publickey-credentials-get; fullscreen"
/>

<!-- HTML example -->
<iframe
  src="https://shop.usesticker.com/embedded/{partner_id}?session_key={token}"
  style="width: 100%; height: 100%; border: none;"
  title="Sticker Embedded Procurement"
  sandbox="allow-same-origin allow-scripts allow-forms allow-popups allow-popups-to-escape-sandbox allow-top-navigation-by-user-activation"
  allow="payment; publickey-credentials-get; fullscreen"
></iframe>
The iframe should take up your full content area. We recommend setting height: 100vh or using a container that fills available space.
5

Test Your Integration

Use the sandbox environment to test before going live.
  • Organization setup creates profile correctly
  • Handshake returns valid session tokens
  • iframe loads and displays products
  • User can add items to cart
  • Checkout process completes successfully
  • User can view order history

​
Code Examples

Choose your preferred language/framework: 
const express = require('express');
const app = express();

const STICKER_API_KEY = process.env.STICKER_API_KEY;
const STICKER_API_URL = 'https://api.usesticker.com/v1';

// One-time: Organization Setup
app.post('/enable-supplies', async (req, res) => {
  const { organization, user } = req.body;
  
  const response = await fetch(`${STICKER_API_URL}/organizations/setup`, {
    method: 'POST',
    headers: {
      'Authorization': `Bearer ${STICKER_API_KEY}`,
      'Content-Type': 'application/json',
    },
    body: JSON.stringify({
      internalOrgId: organization.id,
      organizationName: organization.name,
      internalUserId: user.id,
      user: {
        firstName: user.firstName,
        lastName: user.lastName,
        email: user.email
      },
      shippingLocations: organization.locations?.map(loc => ({
        internalShippingLocationId: loc.id,
        name: loc.name,
        address: {
          line1: loc.address.line1,
          city: loc.address.city,
          province: loc.address.state,
          postalCode: loc.address.zip
        },
        isDefault: loc.isPrimary
      }))
    })
  });
  
  const data = await response.json();
  
  // Store profile.id in your database
  await db.organizations.update(organization.id, {
    stickerProfileId: data.data.profile.id
  });
  
  res.json({ success: true, data });
});

// Per-session: User Handshake
app.post('/supplies/auth', async (req, res) => {
  const { userId } = req.body;
  
  const response = await fetch(`${STICKER_API_URL}/partner/handshake`, {
    method: 'POST',
    headers: {
      'X-API-Key': STICKER_API_KEY,
      'Content-Type': 'application/json',
    },
    body: JSON.stringify({
      internal_user_id: userId
    })
  });
  
  const data = await response.json();
  res.json({
    session_key: data.session_key,
    iframe_url: data.iframe_embed_url
  });
});

​
What the Embedded Experience Looks Like

Product Browsing
Cart and Checkout
Order History

​
Next Steps

Organization Setup

Complete API reference for provisioning organizations

User Handshake

Complete API reference for session authentication

iframe Embedding

Best practices for embedding the iframe in your app

Security

Security considerations and best practices

​
Getting Help

Need assistance? Our team is available to help you with your integration: