API CHANGE

CartLine の viewKey がレスポンスで読める

送ったキーをそのまま返す。UUID変換の手間がゼロに。

YOUR APPviewKey: "item-A"cartLinesUpdateStorefront APICartLineid: "gid://...UUID"viewKey: "item-A" ✓以前: レスポンスは UUID のみ → viewKey との照合に追加処理が必要以降: viewKey をレスポンスから直接読み取り → マッピング不要

Storefront API の CartLine タイプに viewKey フィールドが追加されました。これまで cartLinesUpdatecartLinesRemove への入力時にのみ使用できた viewKey が、クエリのレスポンスでも返ってくるようになります。Liquid ストアフロントで描画済みの行と API レスポンスの行を、UUID を介さずに直接照合できます。

WHAT CHANGED

01Before / After — viewKey の扱いの変化

BEFOREAFTERinputcartLinesUpdateviewKey: "item-A" → 送信responseid: "gid://shopify/CartLine/UUID"viewKey: ─── (返ってこない)→ UUID ↔ viewKey のマッピングテーブルをアプリ側で管理する必要ありinputcartLinesUpdateviewKey: "item-A" → 送信responseid: "gid://shopify/CartLine/UUID"viewKey: "item-A" ← 返ってくる ✓→ クエリ結果から直接viewKey で照合可能。マッピング管理が不要にNEWUSE CASES

02業務に活かせる具体ユースケース

課題
Liquid テンプレートで行に独自のキー(商品バリアント+オプション組み合わせIDなど)を付与しているが、JS側の Cart AJAX APIレスポンスでは UUID しか返らず、どの行がどのキーか管理テーブルを別途保持していた。
打ち手
CartLine.viewKey をクエリに追加し、Liquid が生成した viewKey をそのままレスポンスで照合する。
効果
クライアントサイドのマッピングオブジェクトが不要になり、コードと状態管理がシンプルになる。
技術メモ
Storefront API の cart クエリに viewKey フィールドを追記するだけ。既存の UUID ベースのロジックはそのまま動作する。
課題
カスタム Headless ストアフロントで、カート行の削除ボタンを押した際に cartLinesRemove へ渡す ID を特定するため、ページ初回ロード時に全行の UUID をローカルストレージにキャッシュしていた。ページ遷移後にキャッシュが失われると照合できなくなる問題があった。
打ち手
削除時に viewKey を入力として渡し、レスポンスの CartLine.viewKey でリスト表示を更新する。UUID キャッシュをなくしてステートレスな設計に移行。
効果
キャッシュ失効バグが根絶され、ページリロード後でも正確に行の状態を把握できるようになる。
技術メモ
cartLinesRemove のレスポンスとして返る cart.linesviewKey を含めることで、削除後の行リストを viewKey 軸で管理できる。
課題
複数のカスタムアプリが同一カートを操作する構成で、それぞれのアプリが「自分が追加した行」を識別する際に UUID だけでは判断できず、メタフィールドや属性に識別子を付加する回避策を使っていた。
打ち手
各アプリが cartLinesUpdate 時に自アプリ固有の viewKey プレフィックスを付与し、クエリ結果の viewKey でフィルタリングして自身の行だけを操作対象にする。
効果
属性への識別子埋め込みという設計上の妥協が不要になり、カート属性を本来の用途に専念させられる。
技術メモ
viewKey はカートがすでに保持している値を返すため、新たなストレージコストは発生しない(元記事記載)。
DEV NOTES

03技術者が押さえるポイント

新フィールド

CartLine.viewKey

Storefront API の CartLine タイプに追加。id(UUID)と並んで返ってくる。クエリに明示的に追記する必要あり。

後方互換

UUID ベースの処理は変わらない

id フィールドは従来どおり機能。viewKey を使わないアプリへの影響はゼロ。段階的移行が可能。

注意

入力専用から読み取りも可能に

これまで viewKey は cartLinesUpdate / cartLinesRemove の入力にのみ存在。今回のアップデートでクエリでも読めるようになった。

Liquid 連携

Liquid ストアフロントと同じ値

CartLine.viewKey は Liquid ストアフロントが描画する viewKey と同一の値を返す(元記事記載)。Liquid↔API 間の整合性が取れる。

クエリ例

使い方はシンプル
query CartLines($cartId: ID!) {
  cart(id: $cartId) {
    lines(first: 10) {
      edges {
        node {
          id
          viewKey
        }
      }
    }
  }
}

ストレージ

追加コストなし

viewKey はカートがすでに内部に保持している値を読むだけ。新たなストレージや処理コストは発生しない(元記事記載)。

「カート行の viewKey がレスポンスで読めるようになったことで、UUID 変換テーブルの管理が不要になり、Liquid と Headless の行照合ロジックを大幅に簡素化できます。」

Source: https://shopify.dev/changelog/cart-line-view-key-field | 公開日: 2026年6月12日