0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Stripe導入手順

Last updated at Posted at 2025-01-13

はじめに

Stripe Checkoutを利用することで、オンライン決済を簡単かつ安全に実装できます。
本手順書では、基本的な実装フローを順序立てて説明します。画像はこちら

導入効果

Stripeを導入することで、以下の効果が得られます:

簡単な操作で支払い画面に遷移

 ユーザーが注文画面で「支払い」ボタンを押すと、Stripeが提供する支払い画面に移動します。

多様な支払い方法に対応

 支払い画面には、クレジットカード、デビットカード、銀行振込、ApplePay、GooglePay、コンビニ決済などのオプションが表示されます。

支払い後のスムーズなリダイレクト

 支払い完了後、自動的に注文画面に戻り、注文処理が続行されます。

自動返金

 注文キャンセルされた場合、自動的に返金が行われます。

開発情報

・サーバーサイド: Java
・フロントエンド: HTML/JavaScript

前提条件

Stripeを利用するために必要な準備:

Stripeアカウントの登録

・Stripeアカウントを作成(無料、初期費用・月額費不要)。
・アカウント作成後、Stripe Dashboardで「開発者メニュー」から「APIキー」を取得。
 ※「公開可能キー(フロントエンド用)」と「シークレットキー(サーバー用)」の2種類が提供されます。

StripeのSDKをインストール

 Stripeが提供するサーバー用SDKを以下の公式サイトからインストールします:https://docs.stripe.com/sdks

開発環境の準備

 EclipseやIntelliJ IDEAなどの開発環境を用意します。

導入手順

Stripe で商品を追加する

 Stripe Dashboardで商品を登録します。
 登録後、各商品に対応する「priceID」が生成されるので、これを保存しておきます。

Stripe でWebhookを設定する

 StripeのWebhookは、Stripeがシステム内で特定のイベント(支払い完了、返金処理、サブスクリプション更新など)を検知した際に、
 事前に指定されたURL(Webhookエンドポイント)にリアルタイムで通知を送信する仕組みです。
 この通知により、ユーザー側のシステムはStripeのイベントに基づいた処理(例: 注文ステータスの更新やメール送信)を自動で実行できます。

フロントエンドの実装
支払いボタンの実装

 支払いボタン押下時に以下の情報をバックエンドに送信します:
 ・APIキー: ショップを識別するために使用。
 ・商品ID: 支払い対象の商品を特定(複数可)。
 ・数量: Stripeが支払い総額を計算するために使用。
 ・注文番号: 支払い成功後に注文状態を更新するために利用。

バックエンドからのリンク受け取り

 ・バックエンドで生成した支払いリンクを受け取り、新規タブで表示します。

キャンセルボタンの実装

 ・キャンセルボタン押下時に注文番号をバックエンドに送信します。

バックエンドの実装

支払い画面の生成

 ・フロントエンドから受け取った情報をもとに、Stripeライブラリを使用して支払い画面のリンクを生成します。
 ・支払い成功時・失敗時のリダイレクト先を設定します。

Webhookを利用した注文状態の更新

 ・StripeのWebhookを利用して、サーバーが支払い状況(成功、失敗、期限切れなど)を受信します。
 ・Webhookのデータをもとに注文番号を特定し、該当注文の状態を更新します。

返金処理

 Stripeの返金プロセスを構築することで、Stripeが自動返金を行われます。

テスト

支払い画面生成の確認

 支払いボタンを押して、正しく支払い画面に遷移するか確認します。
 また、Stripeが提供するテスト用カード番号(例: 4242 4242 4242 4242)を使用して、支払いフローの動作をテストします。

Webhookのテスト

 ローカル環境ではWebhookサービスを直接利用できないため、以下の手順で代替テストを行います。

返金処理の確認

 キャンセルボタンを押して、正しく返金が行われることを確認します。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?