Tutorial - Checkout new subscription
Please check the flow diagram, if you need to open checkout via hosted pages API
Honey Comics - Demo Application
Honey Comics, a demo application, is a fictitious online comic book store providing subscription service for comics. They send comic books weekly to their subscribers. Users can sign up for a subscription providing their payment details. Click here for a demo. The steps below will help you build an app similar to the demo.
To checkout new subscription via API, you need to:
- Signup/Signin to your Chargebee account
- Create a new plan with a trial period in your Chargebee TEST site.
- Grab the Chargebee API key of your Chargebee TEST site.
Setup the client library
Download and import the client library of your choice. and configure the client library with your Chargebee TEST site name and API key.
Build the signup page
In the demo we are using a two-step checkout process. Customer's account information is collected in the first step and when he clicks on subscribe, Chargebee's checkout page will open.
A sample input element is shown below,
Endpoint that returns a hosted page object
In the server side, Chargebee's checkout new subscription API is used to create a hosted page object for the new subscription, by passing the information collected from the client side.
Bind checkout opening with the click event
In the client side, a function that returns a 'Promise' object must be created. This promise object can be a result of an ajax call, which is done to the end point which we created in the previous step, and this must resolve to an hosted page object.