Cover eCom v3 + Contentful

Contentful + Webshop Cart — How It Works

A visitor on your Contentful page clicks Add to Cart. Here's what happens.

Approach B No token management Standard checkout

Step by step

Four steps, start to checkout

No JavaScript frameworks, no special SDK. Just a link, a redirect, and one API call.

1
Visitor clicks "Add to Cart"

The browser navigates to Webshop. Just like clicking any normal link.

2
Webshop adds the product

The item lands in the visitor's real cart, tied to their browser session. Webshop immediately redirects them back.

3
Contentful page shows the cart

The page reads the opaque cart token from the URL and fetches cart contents from Webshop's API. No page reload.

4
Visitor checks out normally

Clicking "Go to Cart" takes them to standard Webshop checkout. No extra steps.

Technical reference

Two touchpoints

Everything this integration needs — one browser navigation and one read-only JSON call.

Endpoint What it does
GET /cart/add Browser nav

Browser navigation — not a fetch(). The visitor's browser navigates to this URL; the product is added to their session cart (PHPSESSID cookie, SameSite=Lax permits the top-level navigation). The controller immediately redirects them back to return_url.

Query parameters

ParameterTypeRequiredDescription
sku string Required Magento product SKU to add.
qty integer Optional Quantity to add. Defaults to 1 when omitted.
return_url string (URL) Required Absolute URL the visitor is redirected back to after adding. Must use http or https. When a CORS origin allowlist is configured, the host must appear on it.

Response — redirect (302)

The controller always issues a 302 redirect. The outcome is encoded in the cart_status query parameter appended to return_url.

OutcomeRedirect URL
Success {return_url}?cart_status=success&cart_token=TOKEN
Product unavailable {return_url}?cart_status=not_available
No / invalid return_url Silently redirects to /checkout/cart

cart_status values

ValueMeaning
success Product was added to the cart successfully.
not_available Product does not exist, is disabled, or is out of stock.

cart_token

  • 64-character alphanumeric opaque token — carries no session or cart data itself.
  • Short-lived: TTL is configurable, default 1 hour.
  • Stripped from the URL by widget JS immediately after reading — the token never lingers in browser history.

No authentication required. The session cookie (PHPSESSID) is sent automatically by the browser as part of the top-level navigation.

GET /rest/{store_code}/V1/atlas/cart/token-info JSON API

Read-only cross-origin JSON call. Returns cart contents — items, quantities, subtotal, and currency — for the opaque token received from the redirect. No authentication required; CORS headers are set by Magento's webapi layer.

Path parameters

ParameterDescription
store_code Magento store code, e.g. default.

Query parameters

ParameterTypeRequiredDescription
token string Required The cart_token value received from the /cart/add redirect.

Response 200 — success

{
  "item_count": 2,
  "subtotal": "34.00",
  "currency_code": "EUR",
  "token": "kTu72CFOcaMbSfYdfEuZfQ3RNRh76Kwm6K1TltVbx4qe13vWS4RrX76ofqkPDcxY",
  "items": [
    {
      "sku": "atempause-magazine",
      "name": "Atempause Magazin",
      "qty": 2,
      "price": "17.00",
      "row_total": "34.00"
    }
  ]
}

Response 404 — error

{ "message": "Invalid or expired cart token." }

Error conditions

  • Token not found or expired (past configured TTL).
  • Token belongs to a logged-in customer's cart — tokens are only valid for guest carts (security boundary).
  • Store code in the path does not match the cart's origin store.

No authentication required. Access-Control-Allow-Origin CORS headers are emitted by Magento's webapi layer.

Interaction diagram

HTTP / API call sequence

Three actors, six steps — all triggered by a single button click.

🌐 Browser
(Contentful page)
🏪 Webshop
Controller
🔌 Webshop
REST API
GET /cart/add?sku=…&qty=…&return_url=…
① browser navigation (top-level)
Adds product to session cart
PHPSESSID cookie sent — SameSite=Lax allows top-level nav
302 → {return_url}?cart_token=TOKEN
② redirect back to Contentful page
JS reads ?cart_token=TOKEN from URL
GET /rest/default/V1/atlas/cart/token-info?token=TOKEN
③ cross-origin fetch (CORS)
200 { item_count, subtotal, items[] }
④ JSON — JS renders cart inline on the Contentful page
🌐 Browser
🏪 Controller
🔌 REST API

Hands-on

Live Demo

This page IS the Contentful page. Click "Add to Cart" — the browser will navigate to the staging Webshop, add the product, and return here with the cart already populated.

📚
Product
Loading…
SKU: R0131-100730
Flow status
Waiting for "Add to Cart" click
Webshop adds product & redirects back
Fetching cart data from API
Cart ready
🛍 Cart Empty
Cart contents will appear here after you add a product.
🔌 Network log
No requests yet.