stripe meetup KOBE #01 on Call !!

神戸で開催したオンライン決済サービス stripe のmeetup stripe meetup kobe #01 レポートです。僕は前日ローンチしたVR素材ECサイト 360images.io の開発ストーリーとstripeがびっくりするほど簡単にインプリメントできるんだ、という話をしてきました。(会場提供:Open Space D.E.P

360images.io の発表資料はこちらです。

 

で、本編の内容などは他のかたのブログにおまかせするとして、この投稿では、当日stripeの決済体験で起こったハプニングと、なぜそんなことになったのか?とか、そもそもなんでこんなことをしようと思ったのか?などなど書いていこうと思います。

 

ことの発端はmeetup3日前…

私たちがD.E.Pでmeetupや勉強会をするとき、だいたい本編が終わったあと、会場でそのまま懇親会に突入します。いつもビールは投げ銭制。冷蔵庫の上の紙コップにお金を入れてもらうかたちです。

でも、今回は stripe の meetup なので、せっかくだし使ってもらおう。というのが3日前。

そして、今回 投げ銭用に用意したURLがこちら(普通にペイメントできるので、注意してくださいねw)

この投げ銭サイトには、Stripe Checkout というサービスを使っています。

とにかく、数10行のコードでセキュアに、かつ、短時間に決済のしくみを作ることができるので、びっくりです。

しかも、この投げ銭システムはサーバーレス。(。。この話はまた次回

体験が大事

「おもしれー!!」って思える体験はほんとに大事。どれだけセッション聞くより一回やってみて感じることがほんとに大事。だから、ぜったい投げ銭stripeはやるべきだと思った。実際おーっ!てなってるの見てて楽しかったです。

stripe 体験でビールを買おう!

 

本編について

本編のもようは、ほかのかたにお任せします。

#JP_STRIPES (STRIPE ユーザーグループ)IN KOBE キックオフに参加してきました

JP_Stripes (Stripe ユーザーグループ)in KOBE キックオフ に参加しました

「宴もたけなわ」のトラブル発生。

さて、本編、懇親会も楽しく終わろうとしていたそのとき、前日 stripe meetup KYOTO #01 でも登壇していた Hide Okamotoさんとstripeの Danielさん から衝撃の一言が。。

「500円て書いてあるのに100円で決済されてる。。。」

「!!!」

顔面蒼白でダッシュボードを見るワタシ。

たしかに、100円で決済されてる。。。なぜ!?

今回の投げ銭サイトは Stripe Checkout のリファレンス にあるサンプルコードをほぼそのまま使っています。5行目のdata-amount が実際に表示される金額です。

ここで入力した支払いのリクエストは、サーバーに送られます。以下はバックエンドのコードです(AWS Lambda)。26行目の引数が決済する金額です。

画面は修正後のものです。

ここに100と書いてあったので、全てのペイメントは100円で決済されていた。ということになります。(がーん)

フロント側に書いてあったdata-amoutはあくまでUIのためのもので、サーバーには送られません。

ちなみに「リクエストから決済金額を取得できないのか?」というのは、開発者であれば自然な考えです。結論からいいますと、リクエストに決済金額は乗ってきません。サーバーに決済情報が送信されるとき、stripe_token(16行目)という決済用のトークンが発行されるのですが、このトークンからリクエストの決済金額を引っ張ることはできません。

 

緊急招集、緊急会議へ!

さて、Danielさん、Hidetaka Okamotoさんとワタシで、緊急コードレビューが始まりました。stripe ダッシュボード、フロントコード、バックエンドコードをレビュー。(22時くらいだったか。。

緊急ミーティングの様子

すでに100円で決済しているので、残りの差額(400円)をいただくようにコードを修正してデプロイ。(ビールは500円で売ってました。。

顔面蒼白で修正するわたし

そして、みなさんに「ごめん!100円だった。差額の400円ください!」と大声でアナウンスして、再び stripe体験。(いいように言うなって。。

Danielさん、Okamotoさん、本当に助かりました!この場をかりてありがとう!m(_ _)m

 

まさかの展開で終了した今回のミートアップ

本編で、登壇いただいたstripeのSarahさんが、障害対応についてのセッションがあった直後の出来事で、まさか私に On Call が来るなんて。。。

 やっぱり神戸では何かが起こる。。。というのを印象づけるミートアップになってしまいました(笑

おもいっきりバグを埋め込んだのは事実なのですが(ごめんなさい、ごめんなさい)、その場ですぐ人が集まって、話して、修正して、デプロイして、報知して、リカバリすることをものの数分でできてしまう、、、

こういうアジリティはAWSをはじめとするクラウドだったり、その上に構築されたstripeの圧倒的な構築のしやすさであったり、余計なものを整える必要がなくなったテクノロジーの進化がほんとに大きいなと感じた瞬間でもありました。

あー焦ったけど、楽しかった。

次回に向けて。。

360images.ioのフェーズ2に向けて、今は、運営側がWPの管理画面から直接商品を入れていますが、これをユーザーさん同士の売買にしたいと思っています。Aさんが素材をアップしてBさんが買う、みたいな。そこで、今回のmeetupでDanielさんのセッションで言われていた stripe Connect を導入して見る予定です。またミートアップで報告できればと思っています。

それでは、また次のstripe meetup KOBE で 体験しましょう!