StripeからクロネコヤマトB2 クラウド連携する

StripeでSolutions Architectをしてる北爪です。

今日12/2に4歳の息子が、チョコが出てくるアドベントカレンダー二日目を開けていたので、[JP_Stripes Advent Calendar 2023](https://adventar.org/calendars/9070)二日目を開けたいと思います。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3633228/e8211091-4349-045c-bb9c-0408fc545f66.png)

ノーコードで決済を可能にする[StripeのPaymentlink](https://stripe.com/jp/payments/payment-links)、ローコードの[Stripe Checkout](https://stripe.com/docs/payments/checkout), アプリに組み込める[Stripe Web Elements](https://stripe.com/docs/payments/elements)にて配送先住所に加えて、配送先電話番号を収集し、出力する方法を解説します。

特に、クロネコヤマトB2クラウドのフォーマット配送先の電話番号が必須項目です。

## Payment Linkにて収集する

作成したPaymentLinkは以下のようになり、住所と電話番号のフォームが追加されます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3633228/c9803463-543f-bdce-ebd6-cf406a81631c.png)


### Dashboardでの設定

配送用の住所と電話番号の提供を求めるにチェックをいれます。これだけです。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3633228/6982e76b-6d8a-cfc2-15c1-97d650a52f15.png)


### Stripe Payment Link - APIからの制御

配送先と電話番号の提供を求めるために、
`shipping_address_collection[allowed_countries][0]"="JP"` に加えて、
`phone_number_collect.enabled: true` を設定します。

```
curl -X POST "https://api.stripe.com/v1/payment_links" \
  -u 'REPLACE_WITH_YOUR_SECRET_KEY':  \
  -d "line_items[0][price]"="price_1NivuuEzgtKktpOy1RpsT0US" \
  -d "line_items[0][quantity]"=1 \
  -d "shipping_address_collection[allowed_countries][0]"="JP" \
  -d "phone_number_collection[enabled]"="true" 
  ```


### Stripe Checkoutにて収集する
APIにて、配送先と電話番号の提供を求めるために、
`shipping_address_collection[allowed_countries][0]"="JP"` に加えて、`phone_number_collect.enabled: true` を設定します。

```
curl -X POST "https://api.stripe.com/v1/checkout/sessions" \
  -u 'REPLACE_WITH_YOUR_SECRET_KEY':  \
  -d "success_url"="https://example.com/back" \
  -d "line_items[0][price_data][unit_amount]"=1099 \
  -d "line_items[0][price_data][currency]"="eur" \
  -d "line_items[0][price_data][product_data][name]"="test product" \
  -d "line_items[0][quantity]"=1 \
  -d "mode"="payment" \
  -d "shipping_address_collection[allowed_countries][0]"="JP" \
  -d "phone_number_collection[enabled]"="true" 
```

### Stripe Elementで収集する

Address Elementを使って収集します。以下にReactのサンプルコードを示します。

```
 <AddressElement options={{mode: 'shipping', allowedCountries: ['JP'], fields: { phone: 'always'}}} />
 <PaymentElement options={paymentElementOptions}/>
 ```

## 決済データを出力する

### dashboardでの表示

ダッシュボードではそれぞれの決済に配送先が登録されます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3633228/d25dd356-01fe-0de9-063b-b5538ee42e0b.png)


クロネコヤマトB2クラウドの出力フォーマットは以下になります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3633228/312f563f-a0bf-1c7a-ce55-17d5885a41e5.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3633228/d4df8177-59d0-10d8-8abf-34d511e0c6b1.png)

購入者が登録した住所は PaymentIntent ObjectをWebhookもしくは APIから取得することで得られます。
Webhookの場合は `payment_intent.succeeded` のeventを、APIでは `GET /payment_intents` or `GET /payment_intents/${payment_intent_id}`　で取得します。

```
 "object": {
    "id": "pi_3NmriAEzgtKktpOy0EVRGpI3",
    "object": "payment_intent",
    ....(超略)
    "shipping": {
      "address": {
        "city": "渋谷区",
        "country": "JP",
        "line1": "神宮前1−5−8",
        "line2": "神宮前タワービルディング22F",
        "postal_code": "150-0001",
        "state": "東京都"
      },
      "carrier": null,
      "name": "Stripe Japan",
      "phone": "+815017439855",
      "tracking_number": null
    },
 }
 ```

あとはCSVなどに変換して、連携します。


### Stripe Sigmaを使ってCSVで落とす
`shipping_phone` はcustomer tableにありますので、Stripe Sigmaを使えば、CSVで手に入ります。

```
select
  *
from
  charges
  join customers on customers.id = charges.customer_id
where
  charges.created > date('2023-12-02')
order by
  charges.created desc
  ```