js-api-client（JS API client 搜索）

Crystallize JS API Client

The @crystallize/js-api-client package provides typed utilities for working with all Crystallize APIs in JavaScript/TypeScript environments.

Consultation Approach

Before writing code, understand the context. Ask clarifying questions:

1. What are you trying to do? Read data, write data, manage carts, handle webhooks?
2. Do you need raw GraphQL or a high-level helper? Helpers reduce boilerplate for common workflows (orders, carts, navigation). Use raw GraphQL via API callers for custom queries or when helpers don't cover the use case.
3. Which API? Catalogue/Discovery for storefront reads, PIM for admin writes, Shop Cart for checkout flows.
4. What auth do you have? staticAuthToken is enough for read-only. PIM/Shop operations need accessTokenId + accessTokenSecret.
5. Is this server-side or client-side? The client works in both, but credentials should only live server-side.

Installation

pnpm add @crystallize/js-api-client
# or npm install @crystallize/js-api-client
# or yarn add @crystallize/js-api-client

Quick Start

import { createClient } from "@crystallize/js-api-client";

const api = createClient({
    tenantIdentifier: "your-tenant",
    // For protected APIs, provide credentials:
    // accessTokenId: '…',
    // accessTokenSecret: '…',
    // staticAuthToken: '…', // for read-only catalogue/discovery
});

// Call any GraphQL API with string queries
const { catalogue } = await api.catalogueApi(
    `query Q($path: String!, $language: String!) {
    catalogue(path: $path, language: $language) {
      name
      path
    }
  }`,
    { path: "/shop", language: "en" },
);

// Close when using HTTP/2 option
api.close();

Configuration

createClient(configuration, options?)

Configuration Options

Client Options

API Callers

All callers share the same signature:

<T>(query: string, variables?: Record<string, unknown>) => Promise<T>;

High-Level Helpers

Available helpers (see High-Level Helpers Reference for full examples):

Authentication

Generate access tokens in the Crystallize App: Settings → Access Tokens

References

• High-Level Helpers - Catalogue Fetcher, Navigation Fetcher, Product Hydrater, Order Manager, Customer Manager, Cart Manager, and more
• Utilities - GraphQL Builder, Signature Verification, Binary File Manager, Pricing Utilities, Request Profiling
• Official Documentation
• GitHub Repository
• NPM Package