こちらのblogでも、WebPayについての情報発信をしていくことになりました。 どうぞよろしくお願いします！
WebPay ExtendとStripe Connect
先日、WebPay Extendという機能をリリースしました。WebPay Extendは、OAuth2.0を利用し認可したユーザのWebPay上のデータを取得したり、課金を発生させるなどの権限を得ることが出来る機能です。 同様にOAuthを利用した機能を提供している決済サービスには、
などがあります。 当シリーズ記事では、この中からStripeが提供するStripe Connectに注目し、利用例を紹介したいと思います。 Stripe Connectの利用例には、ECから分析、顧客管理システム(CRM)まで幅広いウェブサービスがあります。具体的にどのようなウェブサービスがあるのでしょうか。今回はECサイトをピックアップして紹介します。
Stripe Connectを利用したウェブサービス
EC
課金を発生させるという利用方法は想像しやすいものの一つでしょう。一番利用例が多いカテゴリになっています。複数の決済ゲートウェイを選択できるサービスが多いです。決済ゲートウェイとつなぎ込む際に、Stripe Connectを利用し、認可を行っています。”Connect to Stripe”ボタンにより認可を行い、売上やカードに関する情報をStripeで確認することができます。
3dcart
オンラインストアを簡単に立ち上げられます。取引ごとの手数料がかからず、24時間電話サポートが受けられます。PCI準拠のセキュリティレベルが確保されています。
Stripeを経由して課金を行えるようにするにはSettingsからPaymentの中にあるOnline Methodsへと進みます。Accept Credit Cardsに進み、Other Payment GatewayのプルダウンリストからStripeを選択します。"Connect with Stripe"より認可を行います。Stripeによる決済を有効にするために、Activeにチェックを入れ、Saveするのを忘れないようにしましょう。
実際にストアを作ってみたところ次の写真のようになりました。
Bigcommerce
オンラインで販売するために必要な全てを提供しています。クーポンによるトラフィック増加など、マーケティングツールも一緒になっています。
Stripeを経由して課金を行えるようにするにはSetup&ToolsからPaymentsを選び、StripeのSetupを行います。
Stripe Connectの画面で、Bigcommerceを認可します。Connect my Stripe accountをクリックします。
設定の終盤で、Stripeのテストモードで課金を使用するか選択することができます。設定が完了したら、デモストアが使えるようになっています。試しにテスト用カードで買い物をしてみたところ問題なく買い物が終了し、Stripe上でも決済の詳細を見ることができました。
ストアの様子
Stripe上での決済の詳細
Celery
ネットショップに事前注文の仕組みを取り入れられます。機会損失を少なくすることができそうです。
Stripeを経由して課金を行えるようにするにはSettingsからPaymentを選択して、Add Payment Gatewayに進みます。Stripe Connectの画面から認可を行います。
Celeryでは、商品(Product)を外部に公開するための方法をいくつか選択することができます。決済するボタンをクリックした際にポップアップで表示する方法や、リンクにより公開する方法などがあります。ここでは、ポップアップで見えるように設定してみました。
Stripe上で、テストモードを選択できなかったため、テスト用カードではカードが拒まれています。
Ecwid
簡単にオンラインストアを作成し、既存のウェブサイト、ブログやFacebookのページに追加することができます。
Stripeを経由して課金を行えるようにするにはSystem Settingsから、Paymentに進み、Credit or debit cardからChoose payment processorをクリックします。Stripeについての説明とともに、Connect with Stripeボタンが表示されます。
これをクリックしStripe Connectの画面で認可を行います。
デフォルトでは、このようなストアを作ることができます。
Highwire
複数のチャネルでネットショップを作ることができます。
Stripeを経由して課金を行えるようにするにはSettingsからPayment Settingsに進み、Credit Card Gatewayを設定します。We use Stripeを選択すると、Connect with Stripeボタンが現れます。
Highwireで試しにストアを作ってみました。簡単に作ることが出来ました。
Squarespace
簡単にウェブサイトやギャラリー、店舗を作成することができます。パララックスを利用した縦スクロール型のカッコイイウェブサイトが作れます。
Stripeの設定方法について書かれたFAQはあるのですが、トライアルでは設定画面を見つけることができませんでした。Squarespaceを有料で使用するときに設定するのではないかと思います。
実際にストアを作ってみました。デザインはいくつものサンプルから選ぶことができます。
Volusion
小規模から中規模ビジネスに向けた、ECソリューションです。
Stripeを経由して課金を行えるようにするにはSettingsからPaymentを選び、Payment Gatewayの設定画面に進みます。Stripeを選択すると、Connect to Stripeボタンが出てきました。
実際にストアを作ってみました。次のようなデザインのストアができあがりました。Volusionで特徴的だと感じたのは、管理者であれば買い物をするフローの中でボタンなどの編集ができてしまうところです。ブラウザのタブなどを切り替えて、ストア画面と管理画面を行き来しなくてよいのは便利そうです。
ECに関連した利用例を紹介しました。ECのシステムと決済ゲートウェイが連携している様子を確認できたかと思います。 次回は、請求書や会計システムとの連携について紹介します。 みなさんのWebPay Extend実装のインスピレーションを刺激する記事になればうれしい限りです。
