StorefrontClient

Your own storefront on a shop's catalog, carts and shopper accounts, through the Storefront API. Checkout, payment and orders stay on Store Hugs: a cart ends in a link to the shop's own checkout page.

Get started

1. Turn it on. In the Store Hugs panel, open Shop Settings → Integration API and set your site's address, which checkout links back to.

2. Make a key.

   • A publishable key (pk_live_…) lists your site's origins, such as https://www.example.com, and works only from browsers on them. It reaches no more than a shopper could, so it may ship in your pages.
   • A secret key (sk_live_…) works only from your server, and is shown once. Pass the shopper's IP as shopperIp, so limits count each shopper rather than your server.

3. Install the SDK:

   npm install @storehugs/integration
   

4. Make a client:

   import { StorefrontClient } from '@storehugs/integration';
   
   // In the browser, with a publishable key:
   const storefront = new StorefrontClient({
       host: 'acme.storehugs.com',
       key: 'pk_live_…',
   });
   
   // On your server, with a secret key:
   const serverStorefront = new StorefrontClient({
       host: 'shop.example.com',
       key: process.env.STOREHUGS_SECRET_KEY!,
       shopperIp: request.headers.get('x-forwarded-for') ?? undefined,
       locale: 'ar',
   });
   

5. Sell: list products, fill a cart, and open its checkout link.

   const { data: products } = await storefront.products.list({ perPage: 12 });
   const cart = await storefront.createCart();
   const session = storefront.cart(cart.cartToken);
   
   await session.addItem(products[0].id, 2);
   const { checkoutUrl } = await session.checkout({ returnPath: '/thanks' });
   
   window.location.assign(checkoutUrl);
   

   Keep cart.cartToken (in a cookie or local storage) to come back to the cart.

Options

Models and methods

Each page describes every method in full: its parameters, the fields it sends and gets back, its refusals and an example.