Making API Calls | Convention Photography Services

Learn how to make HTTP requests to CPS APIs for photo browsing, order management, and system integration.

HTTP Methods

CPS APIs use standard REST HTTP methods:

GET: Retrieve data (events, photos, orders)
POST: Create resources (orders, feedback)
PUT: Update resources (order status)

Base URLs

Use the appropriate base URL for each platform:

const GALLERY_API = 'https://photos.conventionphotography.com';
const ORDERING_API = 'https://convention.photos';
const ORDERS_API = 'https://cps-orders.replit.app/api';

Request Headers

Include standard headers for all requests:

const headers = {
  'Content-Type': 'application/json',
  'User-Agent': 'Your-App-Name/1.0'
};

Response Handling

All APIs return JSON responses. Handle both success and error cases:

const handleResponse = async (response) => {
  if (!response.ok) {
    const error = await response.json();
    throw new Error(error.message || 'API request failed');
  }
  return response.json();
};

Common Patterns

Pagination

Photo endpoints support pagination:

const getPhotos = async (eventCode, page = 1, limit = 50) => {
  const url = `${GALLERY_API}/event/${eventCode}?page=${page}&limit=${limit}`;
  const response = await fetch(url);
  return handleResponse(response);
};

Error Handling

Implement comprehensive error handling:

try {
  const photos = await getPhotos('ASDAR26');
  // Process photos
} catch (error) {
  if (error.message.includes('404')) {
    // Event not found
  } else if (error.message.includes('500')) {
    // Server error
  } else {
    // Other error
  }
}

CORS Considerations

All CPS APIs include CORS headers for web integration. No proxy required for browser-based requests.

Code Examples

Browse Events

// Get all available events
const events = await fetch(`${GALLERY_API}/event`)
  .then(handleResponse);
// Get photos from specific event
const photos = await fetch(`${GALLERY_API}/event/ASDAR26?page=1&limit=50`)
  .then(handleResponse);

Create Order

const orderData = {
  eventSlug: 'ASDAR26',
  photos: ['1234', '1235'],
  customerInfo: {
    name: 'John Doe',
    email: 'john@example.com'
  },
  shippingAddress: {
    line1: '123 Main St',
    city: 'Springfield',
    state: 'IL',
    zip: '62701'
  }
};
const order = await fetch(`${ORDERING_API}/api/orders/create`, {
  method: 'POST',
  headers,
  body: JSON.stringify(orderData)
}).then(handleResponse);

Check Order Status

// Get pending orders
const pendingOrders = await fetch(`${ORDERS_API}/orders/pending`)
  .then(handleResponse);
// Get order summary
const summary = await fetch(`${ORDERS_API}/orders/summary`)
  .then(handleResponse);

Rate Limiting

Public browsing: No limits
Order submission: CAPTCHA required
Admin access: Authenticated requests only

Best Practices

Cache responses for photo metadata
Implement retry logic for transient failures
Validate data before submission
Handle network errors gracefully
Use HTTPS for all requests

Quick example

Here’s a minimal example showing navigation structure in docs.yml:

docs.yml

navigation:
  - section: Getting started
    contents:
      - page: Introduction
        path: docs/pages/intro.mdx
      - page: Quickstart
        path: docs/pages/quickstart.mdx
  - api: API Reference

For complete navigation options, see the navigation documentation.