Checkout for Subscriptions

The easiest way to integrate Octobat is via Checkout which allows you to calculate taxes automatically, collect payments and make Stripe API calls.

Thanks to this integration you'll be able to:

  • Collect billing information about your customer.
  • Collect payments with right tax rates.
  • Make Stripe API calls.
  • Send the transaction information, with the rest of your form, to your server.

Example

The button below is what you'll success to generate with this guide. Try clicking on it, filling in with one of Stripe’s test card numbers (the most common is: 4242 4242 4242 4242).
Entering your email will allow you to receive a beautiful invoice.

Guide

To get started, follow the code below in your own language to generate one button.

1. Integrate <checkout />

Paste the code below in your view.


                      <%= form_tag(ACTION_PATH, method: "POST") do %>
                        <script src="https://s3-eu-west-1.amazonaws.com/js.octobat.com/js/octobat-checkout-0.0.0.js" class="octobat-checkout-button"
                          data-octobat-pkey="YOUR_OCTOBAT_PUBLISHABLE_KEY"
                          data-supplier-name="YOUR BUSINESS NAME"
                          data-billing-address="true"
                          data-description="YOUR DESCRIPTION"
                          data-plan="YOUR_STRIPE_PLAN_ID"
                          data-image="YOUR_URL_LINK"
                          data-label="BUTTON LABEL"
                          data-taxes="excluded"
                          data-detailed-panel="true">
                        </script>
                      <% end %>
                    

You can easily retrieve YOUR_OCTOBAT_PUBLISHABLE_KEY on your Octobat account within the part: "API keys / Webhooks".

You can add more attributes to set up the form. Read more about them in the Checkout’s reference.

2. Retrieve transaction data in your form callback

Install the gem 'jwt'. In your Gemfile:


                    gem 'jwt'
                  

More about the gem jwt


Paste the code below in your action form method controller to decode the JWT.


                    decoded_token = JWT.decode params["transactionDetails"], "YOUR_OCTOBAT_SECRET_KEY", true, { :algorithm => 'HS256' }
                    puts decoded_token
                  

You can easily retrieve YOUR_OCTOBAT_SECRET_KEY on your Octobat account within the part: "API keys / Webhooks".


Here is the JSON data returned.


                    [
                      {
                          "transaction_id":"sub_7iBhz7kXIRpygF",
                                    "type":"subscription",
                                 "gateway":"stripe",
                                     "iat":1449507869
                      },
                      {
                          "typ":"JWT",
                          "alg":"HS256"
                      }
                    ]
                  

Feel free to store these data in your own database.

1. Integrate <checkout />

Paste the code below to generate the button.


                      <form action="" method="POST">
                        <script src="https://s3-eu-west-1.amazonaws.com/js.octobat.com/js/octobat-checkout-0.0.0.js" class="octobat-checkout-button"
                          data-octobat-pkey="YOUR_OCTOBAT_PUBLISHABLE_KEY"
                          data-supplier-name="YOUR BUSINESS NAME"
                          data-billing-address="true"
                          data-description="YOUR DESCRIPTION"
                          data-plan="YOUR_STRIPE_PLAN_ID"
                          data-image="YOUR_URL_LINK"
                          data-label="BUTTON LABEL"
                          data-taxes="excluded"
                          data-detailed-panel="true">
                        </script>
                      </form>
                    

You can easily retrieve YOUR_OCTOBAT_PUBLISHABLE_KEY on your Octobat account within the part: "API keys / Webhooks".

You can add more attributes to set up the form. Read more about them in the Checkout’s reference.

2. Retrieve transaction data in your form callback

Install the gem 'jwt'.


                    gem install jwt
                  

More about the gem jwt


Paste the code below in your action form method to decode the JWT which contains the transaction details.


                    require 'jwt'
                    decoded_token = JWT.decode THE_JWT_ENCODED(transactionDetails), "YOUR_OCTOBAT_SECRET_KEY", true, { :algorithm => 'HS256' }
                    puts decoded_token
                  

You can easily retrieve YOUR_OCTOBAT_SECRET_KEY on your Octobat account within the part: "API keys / Webhooks".


Here is the JSON data returned.


                    [
                      {
                          "transaction_id":"sub_7iBhz7kXIRpygF",
                                    "type":"subscription",
                                 "gateway":"stripe",
                                     "iat":1449507869
                      },
                      {
                          "typ":"JWT",
                          "alg":"HS256"
                      }
                    ]
                  

Feel free to store these data in your own database.

1. Integrate <checkout />

Paste the code below to generate the button.


                      <form action="" method="POST">
                        <script src="https://s3-eu-west-1.amazonaws.com/js.octobat.com/js/octobat-checkout-0.0.0.js" class="octobat-checkout-button"
                          data-octobat-pkey="YOUR_OCTOBAT_PUBLISHABLE_KEY"
                          data-supplier-name="YOUR BUSINESS NAME"
                          data-billing-address="true"
                          data-description="YOUR DESCRIPTION"
                          data-plan="YOUR_STRIPE_PLAN_ID"
                          data-image="YOUR_URL_LINK"
                          data-label="BUTTON LABEL"
                          data-taxes="excluded"
                          data-detailed-panel="true">
                        </script>
                      </form>
                    

You can easily retrieve YOUR_OCTOBAT_PUBLISHABLE_KEY on your Octobat account within the part: "API keys / Webhooks".

You can add more attributes to set up the form. Read more about them in the Checkout’s reference.

2. Retrieve transaction data in your form callback

Install JWT thanks to Composer. Paste the code below within composer.json.


                    {
                      "require": {
                          "firebase/php-jwt": "master"
                      }
                    }
                  

More about the composer jwt


Paste the code below in your action form method to decode the JWT which contains the transaction details.


                    <?php
                      use \Firebase\JWT\JWT;
                      $decoded_token = JWT::decode($_POST['transactionDetails'], "YOUR_OCTOBAT_SECRET_KEY", array('HS256'));
                      print_r($decoded_token);
                    ?>
                  

You can easily retrieve YOUR_OCTOBAT_SECRET_KEY on your Octobat account within the part: "API keys / Webhooks".


Here is the JSON data returned.


                    [
                      {
                          "transaction_id":"sub_7iBhz7kXIRpygF",
                                    "type":"subscription",
                                 "gateway":"stripe",
                                     "iat":1449507869
                      },
                      {
                          "typ":"JWT",
                          "alg":"HS256"
                      }
                    ]
                  

Feel free to store these data in your own database.

1. Integrate <checkout />

Paste the code below to generate the button.


                      <form action="" method="POST">
                        <script src="https://s3-eu-west-1.amazonaws.com/js.octobat.com/js/octobat-checkout-0.0.0.js" class="octobat-checkout-button"
                          data-octobat-pkey="YOUR_OCTOBAT_PUBLISHABLE_KEY"
                          data-supplier-name="YOUR BUSINESS NAME"
                          data-billing-address="true"
                          data-description="YOUR DESCRIPTION"
                          data-plan="YOUR_STRIPE_PLAN_ID"
                          data-image="YOUR_URL_LINK"
                          data-label="BUTTON LABEL"
                          data-taxes="excluded"
                          data-detailed-panel="true">
                        </script>
                      </form>
                    

You can easily retrieve YOUR_OCTOBAT_PUBLISHABLE_KEY on your Octobat account within the part: "API keys / Webhooks".

You can add more attributes to set up the form. Read more about them in the Checkout’s reference.

2. Retrieve transaction data in your form callback

Install the JWT package 'PyJWT'.


                    pip install PyJWT
                  

More about the JSON Web Token implementation


Paste the code below in your action form method to decode the JWT which contains the transaction details.


                    import jwt
                    decoded_token = jwt.decode(THE_JWT_ENCODED(transactionDetails), 'YOUR_OCTOBAT_SECRET_KEY')
                    print(decoded_token)
                  

You can easily retrieve YOUR_OCTOBAT_SECRET_KEY on your Octobat account within the part: "API keys / Webhooks".


Here is the JSON data returned.


                    {
                      "transaction_id":"sub_7iBhz7kXIRpygF",
                                "type":"subscription",
                             "gateway":"stripe",
                                 "iat":1449507869
                    }
                  

Feel free to store these data in your own database.