#Stripe API checkout  / Web form input credit card / setup mode / #Ruby example 

- publish checkout session by API
- use checkout session id in client e.g html + js and redirect to Stripe webform
- After checkout you can retrieve payment method by API

https://stripe.com/docs/payments/checkout/collecting

```rb
# Docs

# https://stripe.com/docs/payments/checkout/collecting

# Code

require 'stripe'

Stripe::api_key = ENV['STRIPE_SECRET_KEY']

checkout_session = Stripe::Checkout::Session.create(
  payment_method_types: ["card"],
  mode: "setup",
  # customer_email: "",
  # client_reference_id: "",
  success_url: "http://example.com",
  cancel_url: "http://example.com",
)

# customer = Stripe::Customer.create
#
# checkout_session = Stripe::Checkout::Session.create(
#  payment_method_types: ["card"],
#  mode: "setup",
#  customer: customer.id
#   success_url: "http://example.com",
#   cancel_url: "http://example.com",
# )

# Exception: Stripe::InvalidRequestError: You can not pass a `customer` in setup mode.

puts checkout_session

# e.g
#
# {
#   "id": "cs_test_nSeAmaYPHYg3uYoJr0AGc8KDPWLX2SnW5ESdiSiNpIwkwb7QjoLBdcUZ",
#   "object": "checkout.session",
#   "billing_address_collection": null,
#   "cancel_url": "http://example.com",
#   "client_reference_id": null,
#   "customer": null,
#   "customer_email": null,
#   "display_items": [

#   ],
#   "livemode": false,
#   "locale": null,
#   "metadata": {
#   },
#   "mode": "setup",
#   "payment_intent": null,
#   "payment_method_types": [
#     "card"
#   ],
#   "setup_intent": "seti_1GDl7YCmti5jpytU0I0ByfjD",
#   "submit_type": null,
#   "subscription": null,
#   "success_url": "http://example.com"
# }



puts <<~HTML
<script src="https://js.stripe.com/v3/"></script>

<script>

var stripe = Stripe('#{ENV['STRIPE_PUBLIC_KEY']}');

stripe.redirectToCheckout({
  // Make the id field from the Checkout Session creation API response
  // available to this file, so you can provide it as parameter here
  // instead of the placeholder.
  sessionId: '#{checkout_session.id}'
}).then(function (result) {
  // If `redirectToCheckout` fails due to a browser or network
  // error, display the localized error message to your customer
  // using `result.error.message`.
});

</script>
HTML

# e.g
#
# Save this html file in your machine and access
#
# <script src="https://js.stripe.com/v3/"></script>
#
# <script>
#
# var stripe = Stripe('pk_test_wxxxxxxxxxxxxxxxxxxxxxx');
#
# stripe.redirectToCheckout({
#   // Make the id field from the Checkout Session creation API response
#   // available to this file, so you can provide it as parameter here
#   // instead of the placeholder.
#   sessionId: 'cs_test_nSeAmaYPHYg3uYoJr0AGc8KDPWLX2SnW5ESdiSiNpIwkwb7QjoLBdcUZ'
# }).then(function (result) {
#   // If `redirectToCheckout` fails due to a browser or network
#   // error, display the localized error message to your customer
#   // using `result.error.message`.
# });
#
# </script>

# Redirect to URL example
# https://checkout.stripe.com/pay/cs_test_fRmOtv2TQjhfo1WmVXCxw68tlckFz6KiIUi2EwvHTACynBckPrfu98L1#fidkdWxOYHwnPyd1blpxYHZxWnJhVDRvd1B3bHRzY2xWSF9ycUJAUVFfZzU1dU9tNkJRTTMnKSd3YGNgd3dgd0p3bGJsayc%2Fa3BpaSknaGxhdic%2FfidicGxhJz8nS0QnKSdocGxhJz8nYzRhMWNnPDQoMGc1NygxPWNmKGc0PDUoNGRjMGFnPTQwMWQwJykndmxhJz8nNTNnMTcxZDMoNzE2MCgxMzwwKDwzY2coYTZgYzM0MjM1ZDU1J3gpJ2dgcWR2Jz9eWHgl

# After checkout


Stripe::Checkout::Session.retrieve(id: checkout_session.id, expand: ["setup_intent", "setup_intent.payment_method"]).setup_intent

# There is payment method

# => #<Stripe::SetupIntent:0x3fc716e16f00 id=seti_1GDlGfCmti5jpytUDumoV2O4> JSON: {
#   "id": "seti_1GDlGfCmti5jpytUDumoV2O4",
#   "object": "setup_intent",
#   "application": null,
#   "cancellation_reason": null,
#   "client_secret": "seti_xxxxxxxxxxxxxxxxxxxxxxxxxx",
#   "created": 1582090721,
#   "customer": null,
#   "description": null,
#   "last_setup_error": null,
#   "livemode": false,
#   "mandate": null,
#   "metadata": {},
#   "next_action": null,
#   "on_behalf_of": null,
#   "payment_method": {"id":"pm_1GDlLxCmti5jpytUaLbokfjU","object":"payment_method","billing_details":{"address":{"city":null,"country":"JP","line1":null,"line2":null,"postal_code":null,"state":null},"email":"example@gmail.com","name":"yuma inaura","phone":null},"card":{"brand":"visa","checks":{"address_line1_check":null,"address_postal_code_check":null,"cvc_check":"pass"},"country":"US","exp_month":11,"exp_year":2030,"fingerprint":"3Dnj9E30BUfyFTcl","funding":"credit","generated_from":null,"last4":"4242","three_d_secure_usage":{"supported":true},"wallet":null},"created":1582091050,"customer":null,"livemode":false,"metadata":{},"type":"card"},
#   "payment_method_options": {"card":{"request_three_d_secure":"automatic"}},
#   "payment_method_types": [
#     "card"
#   ],
#   "single_use_mandate": null,
#   "status": "succeeded",
#   "usage": "off_session"
# }
```

![image](https://user-images.githubusercontent.com/13635059/74805400-53528100-5326-11ea-994c-a255a2350787.png)

succeeded and redirect to 

![image](https://user-images.githubusercontent.com/13635059/74805401-53eb1780-5326-11ea-968d-0685b876cf29.png)


# JP

Stripe API API で WebFormで決済情報・カード情報を登録するためのセッションを発行する

# Original by Github issue

https://github.com/YumaInaura/YumaInaura/issues/2997








<!-- Update From Qiita API -->

# チャットメンバー募集


何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。

https://line.me/ti/g2/eEPltQ6Tzh3pYAZV8JXKZqc7PJ6L0rpm573dcQ





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->