Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Stripe Apps + kintoneで 請求業務・顧客サポートを より便利にする方法 /...

Stripe Apps + kintoneで 請求業務・顧客サポートを より便利にする方法 / jp-stripes-nagoya

Hidetaka Okamoto (Stripe)

September 02, 2022
Tweet

More Decks by Hidetaka Okamoto (Stripe)

Other Decks in Programming

Transcript

  1. 岡本 秀高 ( @hidetaka_dev ) • Stripe Developer Advocate (ex-developer

    in Digitalcube) • JavaScript / TypeScript developer • AWS / Next.js / WordPress / etc… • WordCamp Kyoto 2017 / JP_Stripes Connect 2019 / AWS Samurai 2017 / etc… 3 kintone Café 名古屋 Vol.8 / JP_Stripes in 名古屋 Vol.5 #kintonecafe.jp #JP_Stripes
  2. Stripe Apps: Stripeを拡張し、運営を効率化するツール 5 kintone Café 名古屋 Vol.8 / JP_Stripes

    in 名古屋 Vol.5 運用の効率化 • 複雑な決済処理フローを簡素化 • Stripe APIを組み合わせたタスク • 外部サービスと連携した自動化 • 独自WF用のPrivateアプリ開発 ツール間のコンテキスト共有 • Stripeとツールでデータをリンク • より詳細なビジネス分析 • CRMでの顧客管理 • 会計データの自動連携 Why use Stripe Apps? Now available in beta
  3. 機能 Marketplace公開済みアプリの例 会計業務効率化 Xero, Bench マーケティング・CRM・顧客サポート Intercom, Mailchimp, SendOwl コンテンツ・コラボレーション・スケジューリング

    DocuSign, Dropbox, Nylas 金融業務 Ramp, FundBox 分析 Baremetrics, Chartmogul Climate Persefoni, Climatiq, Vaayu Others (e.g. 税務, データ連携 Exemptax.com, Render Appでできること(例) Stripe Apps 7
  4. 機能 Marketplace公開済みアプリの例 会計業務効率化 Xero, Bench マーケティング・CRM・顧客サポート Intercom, Mailchimp, SendOwl コンテンツ・コラボレーション・スケジューリング

    DocuSign, Dropbox, Nylas 金融業務 Ramp, FundBox 分析 Baremetrics, Chartmogul Climate Persefoni, Climatiq, Vaayu Others (e.g. 税務, データ連携 Exemptax.com, Render Appでできること(例) Stripe Apps 8
  5. Stripe Appsとkintoneを接続する 14 kintone Café 名古屋 Vol.8 / JP_Stripes in

    名古屋 Vol.5 GET https://{subdomain}.cybozu.com/oauth2/authorization?client_id=xxx&redirect_uri=xxx&... • kintoneのOAuth認証画面へのURL • OAuthクライアントのIDや、Stripe AppsのURLなどを設定する • Scopeでアクセスしたいリソースを指定しないと、アクセストークンを取得しても APIがHTTP400に POST https://{subdomain}.cybozu.com/oauth2/token • 認証後にアクセストークン・リフレッシュトークンなどを取得する API URL • CORSでフロントエンドから呼び出せない様子なので、 ExpressなどでAPIサーバーを用意 • トークン情報は、 StripeのSecret Store APIで、Stripeアカウント内に保存 *LTなのでコードは割愛 [Stripe SDK] stripe.apps.secrets.find({ name: ‘token’, scope: { type: ‘account’ }, expand: [‘payload’] } ) • Secret Storeに保存したアクセストークンなどを取得する API • Scopeをuserにすると、ログインユーザーごとにデータを管理できる • Stripe Appsで外部サービスと連携するために必須
  6. Stripe Apps with kintoneの使い所 • kintoneとStripeのワークフロー統合 ◦ Stripeのデータをkintoneに送る ▪ 顧客・商品情報をkintone側のアプリに同期

    ▪ 未払いや返金の記録をkintoneの問い合わせ管理に反映 ◦ kintoneのデータをStripeダッシュボードで見る・利用する ▪ 返金やプラン変更操作後、 顧客への連絡や対応履歴の記録をStripeダッシュボードでまとめて操作 ▪ 案件管理や顧客情報から、 その会社への特別なオファー(見積書・割引クーポン・etc)を作成して送信 18 kintone Café 名古屋 Vol.8 / JP_Stripes in 名古屋 Vol.5
  7. Stripe App MarketPlaceの注意点 • App MarketPlaceにアプリを公開したり、公開アプリを利用したりできる • ただしkintone連携アプリは、少し難易度が高そう ◦ OAuth2.0

    + PKCEでの認証が必須 ◦ Stripe Apps側のCORS設定に*(ワイルドカード)が使えない • 現時点では、個別のクライアントに応じた以下の受託案件化の方が固そう ◦ Stripeダッシュボードのカスタマイズ ◦ kintoneと連携したワークフローの提案 ◦ OAuthやkintone APIを遊ぶ場所 19 kintone Café 名古屋 Vol.8 / JP_Stripes in 名古屋 Vol.5
  8. サンプルコード: https://github.com/stripe/stripe-apps/tree/main/examples • 開発の参考になるサンプルアプリ群 ◦ TODO ◦ Webhookインストール ◦ OAuth

    ◦ FocusView / SettingsView ◦ etc.. • もしくはQiitaで[ Stripe Apps ]で検索! https://qiita.com/organizations/stripe 21 kintone Café 名古屋 Vol.8 / JP_Stripes in 名古屋 Vol.5