# チェックアウト完了時に外部アプリにメッセージを送信したい

**URL:** <https://community.shopify.com/t/topic/573436>\
**Category:** 総合的なディスカッション\
**Created:** [October 31, 2025, 3:51am UTC](https://community.shopify.com/t/topic/573436 "2025-10-31T03:51:49Z")\
**Posts on this page:** 7\
**Page:** 1

## AI-generated summary

Storefront APIで開くチェックアウト完了時に、外部アプリへ通知してWebViewを閉じたいという相談。checkout.liquid廃止後の代替として、Checkout UI ExtensionsよりもWeb Pixelの利用が簡単ではないか、という提案が出た。

主な整理点:
- Web Pixelの標準イベントで、checkout_completed（購入完了）やcheckout_started（開始）を検知できる。
- ただし、購入商品の「商品タグ」はcheckout_completedのlineItemsから取得できず、特定タグ付き商品の購入判定はそのままでは難しい。
- 回避策として、カート投入時にストアフロント側JavaScriptで商品タグ情報をCookieやLocalStorageへ保存し、Web Pixel側で参照する案が示された。

複数ストアでの適用範囲も整理された:
- アプリ拡張として提供するWeb Pixelは、アプリをインストールした全ストアに反映。
- ストア管理画面で設定するCustom Web Pixelは、そのストアのみに反映。

結論として、購入完了通知自体はWeb Pixelで可能。商品タグによる判定は追加実装が必要で、完全な標準機能だけでは未解決。

<div class="post-metadata">

**Author:** ![store\_K](https://avatars.discourse-cdn.com/v4/letter/s/7993a0/32.png) [@store\_K](https://community.shopify.com/u/store_K)\
**Post date:** [October 31, 2025, 3:51am UTC](https://community.shopify.com/t/topic/573436/1 "2025-10-31T03:51:49Z")

</div>

storefrontAPIを使用したECアプリを構築しようとしています。  
チェックアウト時にはチェックアウトURLをアプリからWebviewで開いて購入を完了させようと想定していて、注文完了時にwevviewを閉じてアプリ側の画面に戻そうとしています。

当初は「checkout.liquid」にjavascriptを追加してjavascript bridgeでアプリ側に購入完了をメッセージで通知させようと考えていましたが、「checkout.liquid」が廃止となり、Checkout Extensibilityへの移行が必要ということを知りました。

そこで確認させていただきたいのですが、  
・Checkout Extensibilityで、注文完了時にアプリ側に通知を送ることは可能でしょうか。  
※アプリ側とShopify側でユーザ情報が異なるため、Webhookによる通知ではアプリを開いているユーザの特定が難しい。  
※複数のサイトと接続するECアプリのため、サンクスページのURLの検知の場合、サイトごとの注文完了画面のURLが必要になるため望ましくないといった事情があります。

---

<div class="post-metadata">

**Author:** ![Qcoltd](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/qcoltd/32/900_2.png) [@Qcoltd](https://community.shopify.com/u/Qcoltd)\
**Post date:** [October 31, 2025, 6:04am UTC](https://community.shopify.com/t/topic/573436/2 "2025-10-31T06:04:04Z")

</div>

@store_K 様

Checkout UI extensionsでもできそうですが、

> **[Checkout UI extensions](https://shopify.dev/docs/api/checkout-ui-extensions/latest)**
>
> Checkout UI extensions let app developers build custom functionality that merchants can install
> at defined points in the checkout flow, including product information, shipping, payment,
> order summary, and Shop Pay.
>     
> 
> \> Shopify Plus:...

Web Pixelを利用された方が簡単かと思います。

> **[About web pixels](https://shopify.dev/docs/apps/build/marketing-analytics/pixels)**
>
> Learn how to create web pixel app extensions to allow merchants to track and send customer behavioral data to a third-party service.

[チェックアウトの完了時](https://shopify.dev/docs/api/web-pixels-api/standard-events/checkout_completed) や、[チェックアウトがスタートした時](https://shopify.dev/docs/api/web-pixels-api/standard-events/checkout_started) など、様々なイベントが用意されています。

[https://shopify.dev/docs/api/web-pixels-api/standard-events](https://shopify.dev/docs/api/web-pixels-api/standard-events)

ご参考まで。  
(キュー田辺)

---

<div class="post-metadata">

**Author:** ![store\_K](https://avatars.discourse-cdn.com/v4/letter/s/7993a0/32.png) [@store\_K](https://community.shopify.com/u/store_K)\
**Post date:** [November 4, 2025, 12:25am UTC](https://community.shopify.com/t/topic/573436/3 "2025-11-04T00:25:54Z")

</div>

@qcoltd-tanabe 様

有難うございます。  
Web Pixelで顧客のチェックアウト完了を検知できるのは試せました。  
1点ご確認させていただきたいのですが、特定のタグを持つ商品の購入を検知することは可能でしょうか？  
後出しの情報となってしまい申し訳ございませんが、ECアプリで販売する商材と、webブラウザから販売する商材を分ける想定がされており、「アプリでの購入の場合」にのみ外部アプリにメッセージを送信したいのですが、この場合でもWeb Pixelで判別することはできるのでしょうか。

---

<div class="post-metadata">

**Author:** ![store\_K](https://avatars.discourse-cdn.com/v4/letter/s/7993a0/32.png) [@store\_K](https://community.shopify.com/u/store_K)\
**Post date:** [November 4, 2025, 10:10am UTC](https://community.shopify.com/t/topic/573436/4 "2025-11-04T10:10:21Z")

</div>

@Qcoltd  
@qcoltd-tanabe 様

重ねての質問申し訳ございません。  
ご確認させていただきたいのですが、Shopify Plusで複数ストアを構築している場合、  
Web Pixelは各ストアごとの設定になりますでしょうか。  
それともストア間で共通になりますでしょうか。

---

<div class="post-metadata">

**Author:** ![Qcoltd](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/qcoltd/32/900_2.png) [@Qcoltd](https://community.shopify.com/u/Qcoltd)\
**Post date:** [November 5, 2025, 6:57am UTC](https://community.shopify.com/t/topic/573436/5 "2025-11-05T06:57:58Z")

</div>

@store_K 様

返信が遅くなりました。

> 1点ご確認させていただきたいのですが、特定のタグを持つ商品の購入を検知することは可能でしょうか？

それはできなさそうですね。  
商品タグがあるとすると、下記のページを見る限り、data.checkout.lineItemsなのですが、そこにタグがありませんので、タグの取得は出来なさそうです。

> **[checkout\_completed](https://shopify.dev/docs/api/web-pixels-api/standard-events/checkout_completed#properties-propertydetail-data)**
>
> The \`checkout\_completed\` event logs when a visitor completes a purchase. It's triggered once for each checkout, typically on the \*\*Thank you\*\* page. However, for upsells and post purchases, the \`checkout\_completed\` event is triggered on the first...

> Web Pixelは各ストアごとの設定になりますでしょうか。  
> それともストア間で共通になりますでしょうか。

各ストアに設定することになりますが、  
ShopifyアプリのエクステンションとしてWebPixelを用意するなら、実質は一括管理となります。  
(ソースコードを修正してデプロイすれば、アプリをインストールしている全てのストアに反映されます。)

強引ですが、WebPixelで商品タグを利用するのであれば、CookieかLocalStorageにどうにしかしてタグ情報を格納すれば良いかと思います。  
WebPixelから親フレームのCookieを参照できますし、LocalStorageも参照できますので。

> **[browser](https://shopify.dev/docs/api/web-pixels-api/standard-api/browser)**
>
> Provides access to specific browser methods that asynchronously execute in the top frame (\`cookie\`, \`localStorage\`, \`sessionStorage\`)

商品のカート投入時に、CookieかLocalStorageを更新するようにしておけば、うまくいくのではないかと思います。  
これは、WebPixelからではなくストアフロント側のJSで処理すると良いかと。(そうすれば、商品タグを参照する方法がいくらでもありますので。)

ご参考まで。  
(キュー田辺)

---

<div class="post-metadata">

**Author:** ![store\_K](https://avatars.discourse-cdn.com/v4/letter/s/7993a0/32.png) [@store\_K](https://community.shopify.com/u/store_K)\
**Post date:** [November 11, 2025, 4:49am UTC](https://community.shopify.com/t/topic/573436/6 "2025-11-11T04:49:10Z")

</div>

@Qcoltd  
@qcoltd-tanabe 様

有難うございます、大分実装イメージができてきました。  
WebPixelの設定を適用する範囲について、下記理解であっているかご確認させてください。

・アプリの方でWebPixelを用意する場合、アプリをインストールするストア全てに反映される。

・ストアの方でWebPixelを設定する場合、設定したストアだけに反映できる。

---

<div class="post-metadata">

**Author:** ![Qcoltd](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/qcoltd/32/900_2.png) [@Qcoltd](https://community.shopify.com/u/Qcoltd)\
**Post date:** [November 11, 2025, 5:13am UTC](https://community.shopify.com/t/topic/573436/7 "2025-11-11T05:13:01Z")

</div>

@store_K 様

> WebPixelの設定を適用する範囲について、下記理解であっているかご確認させてください。
> 
> ・アプリの方でWebPixelを用意する場合、アプリをインストールするストア全てに反映される。
> 
> ・ストアの方でWebPixelを設定する場合、設定したストアだけに反映できる。

はい、ご理解通りです。

話が横道にそれますが、  
ストアの方で設定するWeb PixelsはCustom Web Pixelsと言います。  
これはiframeで動作します。  
アプリから設定するWeb Pixelsはweb workersで動作します。  
だからなんだというわけではありませんが、  
微妙に実行環境が異なりますのでもしうまく動かないことがあれば、この違いも考慮されると良いです。

> **[About web pixels](https://shopify.dev/docs/apps/build/marketing-analytics/pixels)**
>
> Learn how to create web pixel app extensions to allow merchants to track and send customer behavioral data to a third-party service.

ご参考まで。  
(キュー田辺)
