2026 電商趨勢報告:AI 搜尋時代的品牌致勝策略索取報告

Headless 商務· 2026年7月15日

Headless 結帳流程怎麼接?

Headless Shopify 通常由自訂前端管理購物車,再透過 checkoutUrl 進入 Shopify 結帳。這篇整理 cart、buyer identity、折扣、市場、狀態保存、分析與付款後回站的完整流程。

Tenten 編輯部 · 電商洞察

Headless Shopify 的商品瀏覽和購物車可以由自訂前端呈現,付款通常仍進入 Shopify web checkout。前端透過 Storefront API 建立 cart、加入商品與顧客情境,準備付款時讀取 checkoutUrl 並導向 Shopify。真正容易出錯的是狀態、market、折扣、追蹤和返回流程。

先把結帳畫成狀態圖,不要只做一顆「前往結帳」按鈕。

Cart ID 要可靠保存

首次加入商品時建立 cart,將 cart ID 存在安全、合適的 session 或 cookie。後續頁面從同一 cart 讀取 lines、cost、discount、delivery 和 warnings。Cart 無效、過期或 API 回傳找不到時,前端要能建立新 cart,並清楚告知顧客哪些內容需要重新確認。

多分頁和快速點擊可能同時更新 cart。Mutation 應避免重複,前端在請求中顯示狀態,完成後以 API 回傳 cart 為準,不能只樂觀修改畫面。

Market 和 buyer identity 必須一致

國家、語言、幣別與顧客身分會影響價格、availability 和 checkout。使用者切換市場時,先定義原 cart 是否能沿用、哪些 line 不再可售,以及 checkout URL 應使用哪個情境。不要只改前端貨幣符號,卻保留另一市場的 cart。

登入顧客的 buyer identity、B2B company location 或 email 也要在適當時機更新。身分失效時,前端應回到可理解的登入或一般購物流程。

折扣與 selling plan 要由 API 確認

優惠碼、automatic discount、訂閱 selling plan、組合關係和 line attributes 都可能影響 cart cost。前端可以即時回饋,但最終顯示使用 API 回傳金額與 user errors。折扣無效、已過期或不適用時,說明原因並保留其他 cart lines。

進入 checkout 前再次讀取 cart,確認價格、庫存和 warnings。顧客在頁面停留期間,商品狀態可能已改變。

使用 checkoutUrl 交接

Shopify Cart object提供 checkoutUrl,用於將買家導向 Shopify web checkout。使用 API 回傳 URL,避免自行拼接或假設網域。導向前可保存來源頁、campaign 和必要 session,但敏感資料不要放在 query string。

Checkout 的付款、地址、運送與稅費由 Shopify 和已設定能力處理。若需要 Checkout UI extension 或 Functions,另行核對方案、surface 與 API 限制。

分析事件要跨網域連續

定義 cart view、begin checkout、payment 和 purchase 的事件來源。前端送出 begin_checkout 後,Shopify checkout 與訂單 webhook 可能各有事件;使用 transaction ID 或 event ID 去重,不能把同一訂單計算兩次。

跨網域、consent 和 referral exclusion 也要在正式環境測試。廣告平台、GA4 和 Shopify 訂單金額因歸因與處理時間可能有差異,但 currency、value 和 transaction ID 不應錯誤。

付款後與放棄後都要處理

付款完成後的 thank-you 與 order status 流程依 Shopify 設定。若要返回自訂前端,確認登入狀態、訂單查詢和客服入口。顧客放棄 checkout 後再回站時,cart 是否仍可用、價格是否更新,也要實測。

測試矩陣包含訪客、登入、不同市場、折扣、訂閱、缺貨、付款失敗、返回、刷新與多裝置。每個案例留下 cart ID、checkout URL、Shopify 訂單和事件證據。將流程放回 Headless Shopify 架構,並為 API、分析與客服分配 owner,才算完整交接。

正式上線後持續監看 cart mutation error、checkout redirect、付款失敗與訂單建立差異,才能發現只在真實流量出現的問題。

想把這些方法用在你的品牌上?

預約免費諮詢