Shopifyの新しいチェックアウト機能への移行 2 - Shop PayとFunctions

前回までの記事に書いた通り、スイッチサイエンスでは目下Shopifyの新しいチェックアウト機能へのマイグレーションを進めていて、特に代金引換に対応するために試行錯誤しています。

前回、カートの画面に「代金引換を希望」のチェックボックスを設けて、お客さまにはカート画面で代金引換を利用するか否かの意思表示をしてもらい、チェックアウト画面ではそれに応じた表示を行うという方法でGoogle PayやApple Payにも対応できるはずと書きました。

つまりこのようにするということ

なお、これが成立する条件として、テーマのカートページのLiquidファイルで〇〇 Pay等の「簡単なチェックアウトボタン」の類を消しておく必要があります。

これでGoogle PayやApple Payについては対応できると思いますが、Shop Pay（というShopifyの提供する支払方法）を導入にする場合は別の問題があります。

というのは（多分ブラウザのCookieに関連することかと思いますが）お客さまのブラウザがすでにShop Payで支払う状態になっている場合、ShopifyのPayment Customization Functionsは機能していないような動作になるということ(*)。

具体的には、Functionsを利用して支払い方法のリストから代金引換以外を消すような処理を書いてあっても、それが反映されず支払方法はShop Payになります。なのでカート画面で「代金引換を希望」すると、支払がShop Pay、配送が代金引換となってしまいます。

これを防ぐにはCheckout UI Extensionsで支払方法が代金引換か否かをcart.attributesに保存して、Delivery Customization Functionがそれを読みとって、支払が代金引換なら配送方法も代金引換、あるいはその逆となるように表示を切り替える必要があります。

面倒ですがこれで支払がShop Payなのに配送が代金引換となることを防ぐことができます。

これでECサイトの裏方的には発払と着払の指定で困ることは無くなるはずですが、これだけだとお客さんにとっては「はあ？」と思うことになるはずです。長いのでこの先はまた次の記事にします。

(*)の箇所については実際に試したところそうなったわけですが、Shopifyの開発者向けドキュメントやフォーラムなどから確かな情報を得ているわけではありません。もしこの辺りのことで詳しいことをご存知の方がいらっしゃったら教えてください。

フォーム画面を開く

システムエンジニア募集中です！

興味のある方はぜひカジュアル面談へ！お待ちしています。