Welcome back, Sarah Johnson
REST Peaceful Rest Funeral Home
SJ
← Back to Dashboard

PunchOut Flow Guide

Understand how PunchOut catalog integration works, step by step

Try It Now
What is PunchOut?

PunchOut is a protocol that lets a procurement system (like SAP, Ariba, or Coupa) launch an external product catalog in the buyer's browser. The buyer shops in the catalog, then the selected items are sent back to the procurement system as a cart — without the buyer ever leaving their workflow.

SCX supports three PunchOut protocols: REST/JSON, cXML, and OCI. The flow is the same for all three — only the request/response format differs.

1
Partner Sends Setup Request

Your system sends a request to SCX with credentials and customer information. SCX authenticates the request and creates a shopping session.

POST /api/punchout/setup
X-Api-Key: scx_your_api_key_here
Content-Type: application/json

{
  "customerId": "YOUR-CUSTOMER-ID",
  "serviceCenterId": "1961",
  "returnUrl": "https://your-app.com/cart-return"
}
POST /api/cxml
Content-Type: text/xml

<?xml version="1.0" encoding="UTF-8"?>
<cXML payloadID="unique-id" timestamp="...">
  <Header>
    <From>
      <Credential domain="NetworkID">
        <Identity>Your Company</Identity>
      </Credential>
    </From>
    <To>
      <Credential domain="NetworkID">
        <Identity>SCX</Identity>
      </Credential>
    </To>
    <Sender>
      <Credential domain="NetworkID">
        <Identity>Your Company</Identity>
        <SharedSecret>your-secret</SharedSecret>
      </Credential>
    </Sender>
  </Header>
  <Request>
    <PunchOutSetupRequest operation="create">
      <BuyerCookie>unique-session-id</BuyerCookie>
      <BrowserFormPost>
        <URL>https://your-app.com/cart-return</URL>
      </BrowserFormPost>
      <Extrinsic name="CustomerID">YOUR-CUSTOMER-ID</Extrinsic>
      <Extrinsic name="ServiceCenterID">1961</Extrinsic>
    </PunchOutSetupRequest>
  </Request>
</cXML>
POST /api/oci
Content-Type: application/x-www-form-urlencoded

USERNAME=your-username
PASSWORD=your-password
HOOK_URL=https://your-app.com/cart-return
CUSTOMER_ID=YOUR-CUSTOMER-ID
SERVICE_CENTER_ID=1961
FUNCTION=CREATE
2
SCX Returns Session URL

SCX creates a session and returns a URL. Your application opens this URL — typically in a modal iframe or a new browser window — so the buyer can browse the catalog.

HTTP 200 OK

{
  "success": true,
  "sessionUrl": "https://scx.example.com/shop/abc123token",
  "sessionToken": "abc123token"
}
HTTP 200 OK (application/xml)

<cXML>
  <Response>
    <Status code="200" text="OK">Success</Status>
    <PunchOutSetupResponse>
      <StartPage>
        <URL>https://scx.example.com/shop/abc123token</URL>
      </StartPage>
    </PunchOutSetupResponse>
  </Response>
</cXML>
HTTP 302 Redirect

Location: https://scx.example.com/shop/abc123token

OCI uses a redirect instead of a response body. Your browser follows the redirect to the catalog.

3
Buyer Browses the Catalog

The buyer sees the Solution Center product catalog filtered to their customer's catalog types and pricing. They browse products, view details, and add items to their cart. The catalog runs inside SCX and is displayed in your application's iframe or window.

4
Cart is Returned to Your Application

When the buyer submits their cart, SCX sends the cart data back to the returnUrl you provided in the setup request. The return method depends on your integration:

  • PostMessage (iframe) — JavaScript window.postMessage sends cart to parent frame
  • Redirect — Browser redirects to your returnUrl with a session token
  • Form POST (cXML) — Hidden form auto-submits cart as cXML PunchOutOrderMessage
  • OCI Form POST — Hidden form auto-submits cart as OCI NEW_ITEM fields to HOOK_URL

Cart data structure (JSON):

{
  "items": [
    {
      "productId": "item-guid",
      "sku": "ABC-1234",
      "name": "Premium Ceremonial Product",
      "quantity": 2,
      "unitPrice": 149.99,
      "currency": "USD",
      "unitOfMeasure": "EA",
      "imageUrl": "/images/product.jpg"
    }
  ],
  "subtotal": 299.98,
  "currency": "USD",
  "itemCount": 1
}
5
Your Application Processes the Cart

Your application receives the cart data and can display it to the user, create a purchase order, or process it however your system requires. You can also query the session endpoint (GET /api/punchout/session/{'{'}token{'}'}) at any time to retrieve the cart data.

Ready to try it?

Open any case and click "Order Products" to walk through the full PunchOut flow.

Go to Cases Configure Settings