1概要


Stripe

はクラウドベースのサービスで、企業や個人がインターネットを介して支払いを受けることができます** 。 Ruby、Node.jsなど)

Stripeは、支払いを受け取ることの複雑さを軽減する抽象化層を提供します。その結果、

クレジットカードの詳細を直接処理する必要はありません。代わりに、請求を承認することを表すトークンを処理します

このチュートリアルでは、ユーザーがクレジットカードを入力することを可能にするサンプルのSpring Bootプロジェクトを作成し、後でhttps://stripe.com/docs/api/java[Stripe API for Javaを使用して一定量のカードに請求します。]。


2依存関係

プロジェクトでhttps://github.com/stripe/stripe-java[Stripe API for Java]を使用するには、対応する依存関係を

pom.xml

に追加します。

<dependency>
    <groupId>com.stripe</groupId>
    <artifactId>stripe-java</artifactId>
    <version>4.2.0</version>
</dependency>

サンプルプロジェクトでは、

spring-boot-starter-parent

を利用します。

<parent>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-parent</artifactId>
    <version>1.5.2.RELEASE</version>
</parent>

また、定型コードを減らすために

Lombok

を使用し、

Thymeleaf

は動的Webページを配信するためのテンプレートエンジンになります。

これらのライブラリのバージョンを管理するために

spring-boot-starter-parent

を使用しているので、

pom.xml

にそれらのバージョンを含める必要はありません。

<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-web</artifactId>
</dependency>
<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
<dependency>
    <groupId>org.projectlombok</groupId>
    <artifactId>lombok</artifactId>
</dependency>

NetBeansを使用している場合は、バージョン1.16.16でLombokを明示的に使用することをお勧めします。Spring Boot 1.5.2で提供されているLombokのバージョンにバグがあると、NetBeansは多くのエラーを生成します。


3 APIキー

Stripeと通信してクレジットカードの請求を実行する前に、


Stripeアカウントの登録

と秘密/公開Stripe APIキーの取得

が必要です。

アカウント確認後、ログインしてhttps://dashboard.stripe.com/dashboard[ストライプダッシュボード]にアクセスします。左側のメニューで「APIキー」を選択します。

リンク:/uploads/api-keys-1024×710.png%201024w[]


テスト用に1つとライブ用に1つ

の2組の秘密/公開鍵があります。これらのキーを後で使用できるように、このタブを開いたままにしておきます。


4一般的な流れ

クレジットカードの請求は、フロントエンド(ブラウザで実行)、バックエンド(当社のSpring Bootアプリケーション)、およびStripeを含む5つの簡単なステップで行われます。

  1. ユーザはチェックアウトページに行き、「Pay with Card」をクリックします.

  2. 塗りつぶしが行われるStripe Checkoutオーバーレイダイアログが表示されます.

クレジットカードの詳細

  1. ユーザーは「Pay <金額>」で確認します.

    • Stripeにクレジットカードを送付する

    • 既存のものに追加されるレスポンスのトークンを取得します


** 金額、公開APIキー、電子メール、トークンを使用してそのフォームを送信します。

バックエンドへ
。バックエンドの連絡先トークン、金額、

秘密のAPIキー。

  1. バックエンドはStripeレスポンスをチェックし、ユーザーに以下のフィードバックを提供します.

操作。

リンク:/uploads/stripe-charge-1-1-300×215.png%20300w[]

以降のセクションでは、各ステップについて詳しく説明します。


5チェックアウトフォーム


Stripe Checkout

は、クレジットカードの詳細を紹介するフォームを表示するhttps://stripe.com/docs/checkout[customizable、mobile ready、およびlocalizableウィジェット]です。 「

checkout.js

」を含めて設定することで、次のことを担当します。

  • 「カード払い」ボタンのレンダリング+


/uploads/pay-with-card.png

** 支払いオーバーレイダイアログのレンダリング([支払い]をクリックした後にトリガーされる)

カード”)

/uploads/stripe-checkout-form-223×300.png%20223w

** クレジットカードの確認

  • 「私を覚えている」機能(カードを携帯電話番号に関連付ける)

  • クレジットカードをStripeに送付して、クレジットカードを

同封のフォーム([Pay <金額>]をクリックした後にトリガーされます)

  • Stripe Checkoutで提供されている以上にチェックアウトフォームを制御する必要がある場合は、https://stripe.com/docs/elements/examples[Stripe Elements]を使用できます。**

次に、フォームを準備するコントローラと、フォーム自体を分析します。


5.1. コントローラ

  • チェックアウトフォームに必要な

    必要な情報を使ってモデルを

    準備するためのコントローラを作成することから始めましょう。

まず、Stripeダッシュボードからテスト版の公開鍵をコピーし、それを使用してSTRIPE

PUBLIC

KEYを環境変数として定義する必要があります。それから

stripePublicKey

フィールドでこの値を使います。

ここでは単に

デモンストレーションの目的で

currency



amount__(セントで表示)を手動で設定していますが、実際のアプリケーションでは、実際の値を取得するために使用できる製品/販売IDを設定することがあります。

次に、チェックアウトフォームを保持するチェックアウトビューにディスパッチします。

@Controller
public class CheckoutController {

    @Value("${STRIPE__PUBLIC__KEY}")
    private String stripePublicKey;

    @RequestMapping("/checkout")
    public String checkout(Model model) {
        model.addAttribute("amount", 50 **  100);//in cents
        model.addAttribute("stripePublicKey", stripePublicKey);
        model.addAttribute("currency", ChargeRequest.Currency.EUR);
        return "checkout";
    }
}

Stripe APIキーに関しては、アプリケーションごとに環境変数として定義できます(テストとライブ)。

  • パスワードや機密情報と同様に、秘密鍵はバージョン管理システムから保護することをお勧めします。


5.2. 形

「Pay with Card」ボタンとチェックアウトダイアログは、データ属性で正しく設定されたスクリプトを含むフォームを追加することによって含まれます。

<form action='/charge' method='POST' id='checkout-form'>
    <input type='hidden' th:value='${amount}' name='amount'/>
    <label>Price:<span th:text='${amount/100}'/></label>
    <!-- NOTE: data-key/data-amount/data-currency will be rendered by Thymeleaf -->
    <script
       src='https://checkout.stripe.com/checkout.js'
       class='stripe-button'
       th:attr='data-key=${stripePublicKey},
         data-amount=${amount},
         data-currency=${currency}'
       data-name='Baeldung'
       data-description='Spring course checkout'
       data-image
         ='http://www.baeldung.com/uploads/android-chrome-192x192.png'
       data-locale='auto'
       data-zip-code='false'>
   </script>
</form>



checkout.js

」スクリプトは送信の直前にStripeへの要求を自動的に起動します。これにより、StripeトークンとStripeユーザーの電子メールが隠しフィールド「

stripeToken

」と「

stripeEmail

」として追加されます。

これらは他のフォームフィールドと一緒にバックエンドに送信されます。スクリプトデータ属性は送信されません。

Thymeleafを使用して、属性「

data-key

」、「

data-amount

」、および「

data-currency

」をレンダリングします。

金額(“

data-amount

”)は表示目的でのみ使用されます(“

data-currency

”と共に)。その単位は使用通貨のセントなので、表示するには100で割ります。

ユーザーが支払いを要求した後、Stripe公開鍵がStripeに渡されます。

秘密鍵はブラウザに送信されるため、ここでは使用しないでください。


6. 充電操作

サーバーサイドの処理では、チェックアウトフォームで使用されるPOSTリクエストハンドラを定義する必要があります。充電操作に必要なクラスを見てみましょう。


6.1. ChargeRequestエンティティ

請求処理中にビジネスエンティティとして使用する

ChargeRequest

POJOを定義しましょう。

@Data
public class ChargeRequest {

    public enum Currency {
        EUR, USD;
    }
    private String description;
    private int amount;
    private Currency currency;
    private String stripeEmail;
    private String stripeToken;
}


6.2. サービス

実際の課金操作をStripeに伝えるための

StripeService

クラスを書きましょう。

@Service
public class StripeService {

    @Value("${STRIPE__SECRET__KEY}")
    private String secretKey;

    @PostConstruct
    public void init() {
        Stripe.apiKey = secretKey;
    }
    public Charge charge(ChargeRequest chargeRequest)
      throws AuthenticationException, InvalidRequestException,
        APIConnectionException, CardException, APIException {
        Map<String, Object> chargeParams = new HashMap<>();
        chargeParams.put("amount", chargeRequest.getAmount());
        chargeParams.put("currency", chargeRequest.getCurrency());
        chargeParams.put("description", chargeRequest.getDescription());
        chargeParams.put("source", chargeRequest.getStripeToken());
        return Charge.create(chargeParams);
    }
}


CheckoutController

で示されているように、

secretKey

フィールドはStripeダッシュボードからコピーしたSTRIPE

SECRET

KEY環境変数から設定されています** 。

サービスが初期化されると、このキーは以降のすべてのStripe操作で使用されます。

Stripeライブラリによって返されるオブジェクトはhttps://stripe.com/docs/api/java#charge__object[charge operation]を表し、operation idのような有用なデータを含みます。


6.3. コントローラ

最後に、チェックアウトフォームによって作成されたPOSTリクエストを受け取る

コントローラを作成し、

StripeService

を介してStripe

に料金を送信します。



ChargeRequest

」パラメータは、フォームに含まれる要求パラメータ「

amount

」、「

stripeEmail

」、および「

stripeToken

」で自動的に初期化されます。

@Controller
public class ChargeController {

    @Autowired
    private StripeService paymentsService;

    @PostMapping("/charge")
    public String charge(ChargeRequest chargeRequest, Model model)
      throws StripeException {
        chargeRequest.setDescription("Example charge");
        chargeRequest.setCurrency(Currency.EUR);
        Charge charge = paymentsService.charge(chargeRequest);
        model.addAttribute("id", charge.getId());
        model.addAttribute("status", charge.getStatus());
        model.addAttribute("chargeId", charge.getId());
        model.addAttribute("balance__transaction", charge.getBalanceTransaction());
        return "result";
    }

    @ExceptionHandler(StripeException.class)
    public String handleError(Model model, StripeException ex) {
        model.addAttribute("error", ex.getMessage());
        return "result";
    }
}

成功したら、ステータス、操作ID、請求ID、および残高取引IDをモデルに追加して、後でユーザーに表示できるようにします(セクション7)。これはhttps://stripe.com/docs/api/java#charge__object[chargeオブジェクト]の内容の一部を説明するために行われています。

私たちの

ExceptionHandler

は充電操作中にスローされる

StripeException

型の例外を処理します。

よりきめ細かいエラー処理が必要な場合は、

CardException



RateLimitException

、または

AuthenticationException

など、

StripeException

のサブクラス用に個別のハンドラを追加できます。



result

”ビューは充電操作の結果をレンダリングします。


7. 結果を表示する

結果を表示するために使用されるHTMLは、課金操作の結果を表示する基本的なThymeleafテンプレートです。充電操作が成功したかどうかにかかわらず、ユーザーは

ChargeController

によってここに送信されます。

<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml' xmlns:th='http://www.thymeleaf.org'>
    <head>
        <title>Result</title>
    </head>
    <body>
        <h3 th:if='${error}' th:text='${error}' style='color: red;'></h3>
        <div th:unless='${error}'>
            <h3 style='color: green;'>Success!</h3>
            <div>Id.: <span th:text='${id}'/></div>
            <div>Status: <span th:text='${status}'/></div>
            <div>Charge id.: <span th:text='${chargeId}'/></div>
            <div>Balance transaction id.: <span th:text='${balance__transaction}'/></div>
        </div>
        <a href='/checkout.html'>Checkout again</a>
    </body>
</html>

成功すると、ユーザーには課金操作の詳細が表示されます。

エラーが発生すると、Stripeから返されるエラーメッセージがユーザに表示されます。

リンク:/uploads/stripe-result-error-300×66.png%20300w[]


8結論

このチュートリアルでは、Stripe Java APIを使用してクレジットカードに請求する方法を説明しました。将来的には、サーバー側のコードを再利用してネイティブのモバイルアプリを提供することができます。

チャージフロー全体をテストするために、実際のクレジットカードを使用する必要はありません(テストモードでも)。代わりにhttps://stripe.com/docs/testing#cards[ストライプテストカード]に頼ることができます。

課金操作は、Stripe Java APIによって提供される多くの可能性の中の1つです。

公式のAPIリファレンス

は、一連の操作全体を案内します。

このチュートリアルで使用されているサンプルコードはhttps://github.com/eugenp/tutorials/tree/master/stripe[GitHubプロジェクト]にあります。