Chargebee's customizable hosted checkout pages provides you with a seamless checkout experience to match your website and all the elements required to assure customers of a safe checkout experience & increase your signup conversions. The theme support ensures that you incorporate your branding elements from your website's design into the payment page. Since it is 'hosted' by Chargebee, no sensitive information passes through your servers, thus completely reduces the security requirements, PCI compliance and more.
Here are a few other options:
'Honey Comics', our demo application, is a fictitious online comic book store providing a subscription service for comics. We send comic books every week to subscribers. Users can sign up for a subscription from the website by providing their credit card information. Subscriptions have trial period and hence the subscriber is not charged immediately. Instead the subscription will remain in trial until the trial period is over. They will be charged automatically (by chargebee) at the end of the trial period.
To try out the tutorial yourself, you'll need the following:
Build a page where users can signup. In our demo application, we've assumed that there will only be a single plan. Hence a simple link will suffice. When the user clicks on subscribe, the request will be sent to the server.
<a href="/checkout_new/checkout" class="btn btn-success btn-lg">Subscribe</a>
Now lets switch to the server side implementation
We first have to download and import the client library of our choice. Then we need to configure the client library with our test site and our test api key.
We send a 302 redirect response to the user's browser with location set to the URL.
Once the user is on the checkout page and has completed the checkout process, Chargebee will send the user back to your server based on the redirect URL that had been passed previously to the hosted page api call.
Additionally, the following parameters will be added to the redirect URL:
id - unique identifier of the hosted page resource.
state - succeeded, failed or cancelled.
It is recommended that you use ‘acknowledge hosted page' API when you are syncing data using the returned URL. This will ensure that multiple redirects of redirect URL with the same hosted page id will not create duplicate entries at your end. Acknowledge API can be called only once for succeeded hosted page. After calling this the state of the hosted page will be changed from succeeded to acknowledged. And if the same api call is made on the same hosted page id again error will be thrown.
Incase the users cancel the checkout, Chargebee will redirect them to the cancel URL that had been passed previously to the hosted page api call. In our case, as we have passed the signup page as the cancel URL, the users will be redirected back to the signup page.
After we've fetched the hosted page, we redirect the user to a simple thank you page. You could add the subscription to your database (skipped in demo) and redirect to the appropriate page.
Here is the summary of steps you need to follow: