Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
#JP_Stripes Sapporo Stripeの活用例を色々ご紹介します!
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
Kazuki Miura
PRO
June 18, 2022
Technology
520
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
#JP_Stripes Sapporo Stripeの活用例を色々ご紹介します!
Elements とか
コンビニ決済とか
Billing とかのお話
Kazuki Miura
PRO
June 18, 2022
More Decks by Kazuki Miura
See All by Kazuki Miura
地域のCCoEの拡大を目指す 企業間コミュニティ 「re:light local」について
miu_crescent
PRO
0
49
us-east-1 に障害が起きた時に、 ap-northeast-1 にどんな影響があるか 説明できるようになろう!
miu_crescent
PRO
13
5.1k
これだけはやっておいた方がよさそう?awsにおけるランサムウェア対策
miu_crescent
PRO
1
160
生成AIを活用した音声文字起こしシステムの2つの構築パターンについて
miu_crescent
PRO
4
430
なぜ あなたはそんなに re:Invent に行くのか?
miu_crescent
PRO
0
410
エンタメ方向のTを広げよう!Werner先生の クロージングキーノートを 深掘りするための小ネタ10
miu_crescent
PRO
1
200
Amazon Bedrockを活用した 報道向け文字起こしシステムの開発
miu_crescent
PRO
1
190
us-east-1 の障害が 起きると なぜ ソワソワするのか
miu_crescent
PRO
0
87
us-east-1 の障害が 起きると なぜ ソワソワするのか
miu_crescent
PRO
3
1.2k
Other Decks in Technology
See All in Technology
起点・思考・出力で分解する 〜PM業務の自動化設計〜
kazu_kichi_67
2
1.1k
Amazon Redshift zero-ETL 統合を活用した軽量なマルチプロダクトデータ可視化基盤 / Lightweight Multi-Product Data Visualization with Amazon Redshift Zero-ETL
kaminashi
0
110
脱SaaS!FDEを支えるプロビジョニングと分離設計
knih
0
300
From Prompt Engineering to Loop Engineering
shibuiwilliam
1
270
自分が詳しくない領域でAIを使う #プロヒス2026
konifar
20
7.9k
iOS アプリの「これって不具合ですか?」を AI に調べてもらう
miichan
0
150
攻撃者がいなくてもAIエージェントはインシデントを起こす
nomizone
0
120
Multi-Agent並列開発を 安全に回すための技術 / Technology for Safely Multi-Agent Parallel Development
tooppoo
0
210
OTel × Datadog で 「AI活用」を計測し、改善に繋げる
shihochan
2
1k
2026-06-24_人とAIの責務分離に基づく開発プロセスの提案.pdf
takahiromatsui
0
240
FPC(フレキシブル)基板にZephyr実装してみた。
iotengineer22
0
180
「勝手に広まる」人気 AI エージェントを爆速で作ろう!(AWS Summit Japan 2026講演資料)
minorun365
PRO
10
2.6k
Featured
See All Featured
End of SEO as We Know It (SMX Advanced Version)
ipullrank
3
4.2k
Deep Space Network (abreviated)
tonyrice
0
210
A Tale of Four Properties
chriscoyier
163
24k
Accessibility Awareness
sabderemane
1
140
Music & Morning Musume
bryan
47
7.2k
Exploring the relationship between traditional SERPs and Gen AI search
raygrieselhuber
PRO
2
4k
エンジニアに許された特別な時間の終わり
watany
107
250k
Collaborative Software Design: How to facilitate domain modelling decisions
baasie
1
250
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.8k
The Power of CSS Pseudo Elements
geoffreycrofte
82
6.3k
Utilizing Notion as your number one productivity tool
mfonobong
4
330
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
12
1.2k
Transcript
Stripe 活用例を いろいろご紹介します! #JP_Stripes Sapporo vol. 7
自己紹介 三浦一樹 北海道テレビ放送株式会社 社内のシステム作ってます スクラムマスターの真似事しながら 企画あげるところから、リリースまで 最近は React/TypeScript でフロント書いてる 方が増えてきたかも。。。
この2年くらいで作ったサービス 動画配信 EC ライブコマース
None
この2年くらいで作ったサービス 動画配信 EC ライブコマース
Stripe で 使ってみた サービスたち カスタマイズ可能な決済UI サブスクリプションの管理 Elements Billing コンビニ決済も
同じ世界観で決済までいきたい!
同じ世界観で決済までいきたい! 動画を見ながら お買い物するのオンラインイベント できれば、 動画を止めずに全ての機能を動作させたい
Stripe の決済画面 めっちゃ簡単! おしゃれが画面に遷移 Stripe さんのドメインに飛ぶ 実装が必要 デザインは自分次第 自分のページにフォーム埋込
Stripe の決済画面 めっちゃ簡単! おしゃれが画面に遷移 Stripe さんのドメインに飛ぶ 実装が必要 デザインは自分次第 自分のページにフォーム埋込
配信を止めずに グッズの決済ま で、できました! スクショが残ってなかった、、、w 動画プレイヤーの上に重ねて 決済画面を作成
Stripe の決済時に 使ってきたAPI Order Charge PaymentIntent → → バックエンドの話は長くなるので、ご質問ください!
コンビニ決済も実装してみた
コンビニ決済! 動画配信
コンビニ決済! 動画配信 セコマ使える!!
詳しくは西山さんのブログを!
支払い手順が書かれた ユニークなアドレスが発行される
ダッシュボードこんな感じ
あれ。。。
None
あれあれ
おやおや、、
手数料考えてなかった! 売上の 半分以上 手数料!!
リリース前日に気がついて コンビニ決済お蔵入り、、、w
仕様はしっかり確認しましょうw
ちなみに、コンビニ決済の返金
サブスク作りたい!
Stripe の決済画面 サブスク 「カスタマーポータル」 マイページみたいなのも 用意されてる 実装が必要 デザインは自分次第 自分のページにフォーム埋込
基本的に都度課金 シリーズ毎のまとめ買い 1話毎の購入
D陣のコンテンツが見れます 加入日に限らず、 次の月の1日に 1,000円課金
次の月の1日に課金 無料トライアルの機能を活用 バックエンド側で申込の度に指定
次の月の1日に課金 色々ググってたら、、 月末月初はちょっと気をつけなくてはいけないらしい
次の月の1日に課金 月末 月初
次の月の1日に課金 UTC = JST - 9h UTC = JST -
9h JST 7月01日 00:00 UTC 6月30日 16:00 申込時に1日にセット UTCで設定される 毎月30日の 16時 OK 次の発動 UTC 7月30日 16:00 JST 7月31日 00:00 JST = UTC + 9h JST = UTC + 9h
次の月の1日に課金 UTC = JST - 9h UTC = JST -
9h JST 7月01日 00:00 UTC 6月30日 16:00 申込時に1日にセット UTCで設定される 毎月30日の 16時 OK 次の発動 UTC 7月30日 16:00 JST 7月31日 00:00 JST = UTC + 9h JST = UTC + 9h ずれちゃう!!
次の月の1日に課金 時間を00時にしちゃうとこうなるので、 一応10時に設定してやってます
ちなみにWebhook 非同期でめっちゃ飛んでくるので、 受け側は気をつけましょう (AWS側で飛ばしてるメールがコケましたw)
Stripe で 使ってみた サービスたち カスタマイズ可能な決済UI サブスクリプションの管理 Elements Billing コンビニ決済も checkout
で簡単にもできるよ!
他の決済サービスとの比較
実装した決済サービス V2 GMOさんは一部仕様調べただけ
一番実装負荷が低かったのは 動くソースコードが出てくる Stripeが一番実装負荷が低い! サーバレスと相性最高
PR 来週の金曜日 AWSの勉強会やります! オンラインで是非!