Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

2019/10/15 JP_Stripes in Hiroshima #5 Stripe ConnectでApplePayを導入してちょっと困った話

90 views

Published on

2019/10/15 に開催されたJP_Stripes in Hiroshimaにてお話した「Stripe ConnectでApplePayを導入してちょっと困った話」のスライド

Published in: Internet
  • Be the first to comment

  • Be the first to like this

2019/10/15 JP_Stripes in Hiroshima #5 Stripe ConnectでApplePayを導入してちょっと困った話

  1. 1. 2019-10-15 JP_StripesinHiroshima#5 TakeshiFurusato StripeConnectで ApplePayを導⼊して ちょっと困った話 #JP_Stripes
  2. 2. 古⾥武⼠(ふるさとたけし)株式会社DIGITALJET所属(プログラマ・リモートワーカー) JAWS-UGOkayamaコアメンバー JP_StripesOkayamaコアメンバー TwilioJP-UGOkayama主催(TwilioChampions) OkayamaWordPressMeetupオーガナイザー SORACOMUGOkayamaコアメンバー めんツナかんかん⾮公式エバンジェリスト #JP_Stripes
  3. 3. 本⽇のお話 Stripeで ApplePay・GooglePayを 導⼊してみた #JP_Stripes
  4. 4. ApplePay・GooglePay #JP_Stripes iPhoneやsafariブラウザに紐付いているアカ ウントを利⽤して決済 ☑ApplePay AndroidやChomeブラウザに紐付いているアカ ウントを利⽤して決済 ☑GooglePay ブラウザやウォレットに登録してい るカード情報で決済をする
  5. 5. #JP_Stripes ビジネスモデル
  6. 6. 利⽤⽅法 #JP_Stripes 参考:https://stripe.com/docs/stripe-js お客様(⽀払者) 提携業者(引取業者)
  7. 7. PaymentRequestButtonの 導⼊ #JP_Stripes ①Elementsをセットアップする ②PaymentRequestのインスタンスを作る ③paymentRequestButtonElementを作成しマウントする ④トークンを送信し⽀払い後の処理をする参考:https://stripe.com/docs/stripe-js/elements/payment-request-button#set-up-stripe-elements Stripe.jsElementsを利⽤して決済フローを理解する@y_toku https://qiita.com/y_toku/items/7e51ef7e69d7cbbfb3ca
  8. 8. 決済の流れ #JP_Stripes 参考:Stripe.jsElementsを利⽤して決済フローを理解する@y_toku https://qiita.com/y_toku/items/7e51ef7e69d7cbbfb3ca 1).Stripe.jsElementsでブラウザから直接Stripeへ決済(カード)情報を渡す 2).Stripeのサーバからフロントエンドにトークンが返ってくる 3).トークンをサーバへ送る 4).Charge/Customerのリクエストをサーバから送る(決済する/決済情報を保存する) 5).Stripeからのレスポンスを受ける
  9. 9. ApplePayへドメイン登録 #JP_Stripes 参考:https://stripe.com/docs/stripe-js/elements/payment-request-button#verifying-your-domain-with-apple-pay Stripe.jsElementsを利⽤して決済フローを理解する@y_toku https://qiita.com/y_toku/items/7e51ef7e69d7cbbfb3ca 重要:sk_liveで認証。sk_testはダメ
  10. 10. #JP_Stripes ところで、、StripeConnectとは 参考:https://stripe.com/docs/connect お客様 (カスタマー) サービス提供元 (プラットフォーム) 提携先 (⼦アカウント)
  11. 11. 本番・テスト環境 #JP_Stripes 本番環境 プラット フォーム (live) ⼦ アカウント (live)Connect! Appleドメイン 登録(Live) テスト環境 プラット フォーム (test) ⼦ アカウント (test)Connect! Appleドメイン 登録(test) × ※Connectしたときに⾃動的にAppleドメイン登録も⾏っている。
  12. 12. 事前にドメイン登録だけ #JP_Stripes テスト環境 プラット フォーム (test) ⼦ アカウント (test)Connect! Appleドメイン 登録(test) × テスト環境でのAppleドメイン登録は諦め、 ⼦アカウントの管理コンソールに表⺬されている APIKeyを利⽤して、⼿動でAppleドメイン登録をした。 →ApplePay表⺬できるがすぐエラーになる ⼦ アカウント (live) Appleドメイン 登録(Live)
  13. 13. #JP_Stripes
  14. 14. StripeConnectのAPIキー #JP_Stripes Connectのキーは 管理コンソールに表⺬されている 公開可能キー(PK)・シークレットキー(SK)とは 別のキーが利⽤されている。 ※しかも管理コンソールには表⺬されない StandardKey ConnectKey Live(SK/PK) ※管理コンソール表⺬のキー ※Connect連携時に発⾏されるキー ⃝ ⃝ ⃝ ⃝ ⃝ ⃝ 通常 Conn ect NG Test(SK/PK) Live(SK/PK) Test(SK/PK)
  15. 15. 困ったときのサポート #JP_Stripes ⽇本語OK、丁寧な対応 ありがとうございました!
  16. 16. ありがとうございました JP_stripesOkayama よろしくおねがいします 観光ついでに岡⼭にも来てね #JP_Stripes

×